vue中的.sync修饰符用法及原理详解

1、不使用.sync时

//父组件给子组件传入一个函数
//se6的写法

//子组件通过调用这个函数来实现修改父组件的状态。
mounted () {
console.log(this.$emit(‘setAge’,1234567));
}

2、使用.sync时

//父组件将age传给子组件并使用.sync修饰符。

//子组件触发事件
mounted () {
console.log(this.$emit(‘update:age’,1234567));
}
这里注意我们的事件名称被换成了update:age
update：是vue为我们约定好的名称部分
age是我们要修改的状态的名称，是我们手动配置的，与传入的状态名字对应起来,这样就完成了，是不是感觉简单了很多。

注意事项：
这里我们必须在事件执行名称前加上update：的前缀才能正确触发事件。