# ## 00Vue组件间的通讯方法(小白笔记)

# ## 00Vue组件间的通讯方法(小白笔记)

本博客是本人学习过程中的一些笔记,分享给大家看个乐呵。本人也是小白学生一个,如有不对之处欢迎指正。
组件通信有五种方法。(博主暂时认知,欢迎指正)

一:props
二:vue自定义事件
三:PubSub(消息订阅与发布)
四:slot
五:vuex

** ---------------------------正文--------------------------*:*
一:props
以下为Vue API的说明
在这里插入图片描述
props适合于父子组件之间的通信,使用方法:
可以在父组件中:强制绑定(以下addComment为一个函数方法,也可以传递数据)
在这里插入图片描述
在子组件中
在这里插入图片描述
也可简单写为
在这里插入图片描述
这里只简单写了俩种简单与复杂的,
二:vue自定义事件
vue.js文档教程的说明
vue自定义事件
1.在这里插入图片描述
在这里插入图片描述
2.
父组件中
在这里插入图片描述
在这里插入图片描述
在生命周期回调函数mounted中执行绑定监听的异步代码
三:PubSub(消息订阅与发布)
需要下载js库
npm install --save pubsub-js
(注:可以用info查看消息)

订阅消息
在这里插入图片描述
发布消息
在这里插入图片描述
与自定义事件对比理解:
在这里插入图片描述
调用
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
四:slot
slot区别以上三种,传递的是标签数据,不仅是数据,一个页面组件重复利用可用slot来进行组件之间的消息传递
在这里插入图片描述 在这里插入图片描述例子
在这里插入图片描述
五:vuex**
暂无

谢谢观看!!

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值