一直使用$emit触发父组件的事件方法来实现改变父组件的值,导致把其他方法都给忘了。特别来整理下,加深下印象吧。
1. $emit('event', val)
最常用的一种方法,父组件通过v-on绑定一个事件,在事件中修改自己的值,子组件通过$emit触发该事件
在子组件MobileMessage中:
这种方法有个好处就是可以在父组件的事件里面做一些额外的处理,但是如果单纯的赋值,这个有点繁琐了。
2. $emit('update:modelName', data)
父组件通过.sync标识符表明prop的双向绑定,.sync是一个简写,完整写法:v-on:update:title="doc.title = $event":
子组件:
相比于第一种方法,少了很多步骤,用起来很方便
3. 自定义事件绑定v-model
父组件:
子组件:
1. model里面声明变量和事件;
2. props也得声明该变量。
详见官网https://cn.vuejs.org/v2/guide/components-custom-events.html