巧妙运用v-model实现父子组件传值的方法示例

熟悉Vue的小伙伴们都知道 v-model 是Vue的一个很大的特色，可以实现双向数据绑定。但本质上呢，它不过是语法糖，它负责监听用户的输入事件以更新数据。v-model 在内部使用不同的属性为不同的输入元素并抛出不同的事件：。通常子组件某个变量更新，并需要告知父组件时，需要子组件触发事件并父组件监听该事件。方法总结：1.子组件设 value 为props属性，并且不主动改变 value 值子组件，包含一个button，并且将 value 属性设为props。点击button时，sum值加1，同时通过 this.$emit 将更新后的值传给父组件父组件中，通过 v-model 绑定一个本地变量，即可实现子父组件同步更新实际上，这个过程是首先子组件通过 $emit 更新父组件的本地变量，然后子组件中的 value 属性通过 props 得以更新这种方式尤其适合子父组件传参的情况