$emit('input', id)中的参数问题


这个实例中 TabItem.vue中的 ```
<button @click="$emit(‘input’, id)" :class="[active, ‘tab’]">
{{ label }}

$emit('input', id)的'input'是干什么用的,在index.vue和TabItme.vue中其他地方并没有用到啊?困惑了好久这个input到底是干什么的,起什么作用?希望有明白的人指点一二。
谢谢

父组件接收子组件的事件

为什么非得是input呢,我换成别的就不行啊?

你要一起改:rofl:

<TabItem v-model="currentId" />
// v-model  可以拆解为
<TabItem :value="currentId" @input="currentId = $event.target.value" />

所以在子组件中

// 通过这个接收
props:['value']
// 通过这个传递
$emit('input', id)

当然这个是默认的,我们也可以更改

// 子组件中定义
model: {
    prop: 'xxx',
    event: 'yyy'
}

// 通过这个接收
props:['xxx']
// 通过这个传递
$emit('yyy', id)
1 Like

讲得很详细地,终于明白了,多谢!