核心点:
1.父组件啥也不用干只需要绑定v-model值
2.子组件接收绑定的props属性必须为value
3.子组件data中必须定义一个属性接收value的值
4.子组件watch监听value的值同步给定义的属性
5.子组件watch监听定义属性的值通过$emit('input')同步给父组件
父组件 <template><div><p>父组件当前的值:{{num}}</p> <button @click="btnClick">减少</button> <child v-modal="num" /></div></template><script>import Child from './child.vue';export default {name: 'parent',components: {Child }, data() { return { num: 0 }; }, methods: { btnClick() { this.num--; }, },};</script> 子组件 <template><div><p>子组件当前的值:{{num}}</p> <button @click="btnClick">增加</button> </div></template><script>export default {name: 'child', props: { value: Number, }, data() { return { num: 0 }; }, watch: { value(val) { this.num = val; }, num(num) { this.$emit('input', num); }, }, methods: { btnClick() { this.num++; }, },};</script>