vue父子组件双向绑定数据


我们在封装组件时,最常使用的父子组件通信方法是props传值,$emit修改,在一些情况中这些必要的操作会显得很麻烦,显得代码很啰嗦,甚至不利于某些功能实现。父组件必须传入值、触发事件,子组件必须接收值、触发事件调用$emit回调。

这种情况下可以使用.sync修饰符双向绑定数据,使子组件可以直接修改绑定数据。代码如下:

父组件:

<view :data.sync="Data"></view>

 

子组件:

this.$emit('update:data', Data)

 

使用.sync修饰符与原来传值方法只有两处区别,父元素传值属性后的修饰符.sync和子组件$emit('updata:~'),这样可以简略一些操作步骤,使得代码看起来更清新简洁。


免责声明!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系本站邮箱yoyou2525@163.com删除。



 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM