vue 父子组件数据双向绑定
父组件
1 <find-search v-model="searchshow"></find-search>
子组件
1 props: { 2 value: { 3 type: Boolean, 4 default: false 5 } 6 }, 7 methods: { 8 back() { 9 this.$emit('input', false); 10 } 11 }
tips:
用v-model绑定数据, 子组件props一定用value, 然后子组件向父组件传递数据, $emit触发Input事件, 即可将数据赋值给父组件的变量
这样就不需要在父组件中自定义事件来改变父组件的值, 我最初也想了很久, 这样的写法为什么不需要自定义事件, 后面想到是v-model的语法糖, 默认监听input事件
- 上一篇 »vue实现组件数据双向绑定
- 下一篇 »常问到的vue、react面试题