超级甜的sync语法糖你尝过了吗？

为什么sync超级甜呢？

因为他非常好用啊，可以使用sync让子组件改变父组件传过来的值，也就是可以在子组件中改变props中的变量了，嘿嘿，这样就可以子父组件同步了。

具体怎么使用呢？

首先父组件传值过来，并且在传值的时候添加.sync后缀

<son :fromFather.sync="fromSon"></son> data(){ return{ fromSon:"父组件的值" } },

子组件接收，并设置改变传过来的fromFather变量

//props props: { fromFather: { type: String, default: '' }, }, //页面 <el-button @click="change">改变他</el-button> <div>{{fromFather}}</div> //按钮的change事件来改变fromFather的值 change() { this.$emit('update:fromFather',"我可以改变了！！") }

最后实现的结果： 所以这样我们就可以在子组件中改变父组件props传过来的值了。

实现的原理是什么呢？

其实就是我们在父组件传值的时候，还给传的变量设置了一个子组件传值给父组件的事件——update:fromFather。所以实现了可以双向改变。