本文详细介绍了Vue中父子组件间的通信方式，包括父传子（通过属性绑定及props接收），子传父（通过$emit触发事件及v-on接收），以及如何在Vue的单向数据流原则下实现父子组件的双向数据绑定，利用watch监听和computed计算属性来实现这一目标。这些技巧对于优化组件间的数据流动和管理至关重要。
当你写个公共组件的时候，需要用到。
页面向自定义的组件，或者父组件向子组件传递时。
在父组件上绑定属性，传递给子组件， 例如：
【Adv】: 子组件标签
【：isShow】:父组件绑定的属性
【isShow1】:父组件想向子组件传递的值。
用props接收父组件绑定事件，传来的值，例如：
【isShow】:就是父组件绑定的属性。它在子组件用props接收后，用this.isShow就可获取使用。
二、子传父
子组件定义的值，想向父组件传递。
【show】:子组件定义的事件名，val传递给父组件的值
2.父组件，v-on接收
【@show】：@，v-on的简写。show是子组件定义的。
【showAdv】:父组件用来接收子组件传值得函数方法。
三、父子组件双向绑定。单向数据流【重要】
因为vue是单向数据流的，父组件修改数据传递给子组件可以，但子组件不能修改父组件传递过来的数据。
要想实现双向数据流，父组件不用做修改。
主要修改子组件
1.用watch监听。
子组件data中定义一个新的副本，用来保存父组件传递过来的值。
用watch监听数据变化。
2.computed计算属性【优化】
不用在data中定义新副本保存父组件传递来的数据
扫一扫
2万+
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
