vue组件隔代通信(爷爷组件与孙子组件通信)
参考:https://blog.csdn.net/qq_39009348/article/details/819774681.方法:$attrs和$listeners两个属性看了官方文档对这两个属性的解释有点抽象,简单的的说$attrs属性可以可以获取顶层组件(爷爷组件)的值(这里的数据是data定义的,而props不可以);$listeners属性相当于顶层组件(爷爷组件)事件监听器首先我定义三
·
参考:https://blog.csdn.net/qq_39009348/article/details/81977468
1.方法:$attrs
和$listeners
两个属性
看了官方文档对这两个属性的解释有点抽象,简单的的说$attrs
属性可以可以获取顶层组件(爷爷组件)的值(这里的数据是data定义的,而props不可以
);$listeners
属性相当于顶层组件(爷爷组件)事件监听器
首先我定义三个组件
- YEYE.vue
- BABA.vue
- SUNZI.vue
最终效果
2.将爷爷组件的值传给孙子组件:
2.1 将爷爷组件的值传给爸爸组件
这里需要借助爸爸组件作为桥梁,链接爷孙组件
这里可以看出我们将爷爷组件的值传给了爸爸组件,
2.2 爸爸组件绑定$attrs
属性
2.3 孙子组件获取值
3.将孙子组件的值传给爷爷组件
3.1 孙子组件通过this.$emit
事件
3.2 爸爸组件设置$listeners
属性
3.3 爷爷组件监听孙子组件发射的事件
更多推荐
已为社区贡献1条内容
所有评论(0)