vue3开发中 父子传值,自定义事件传值,兄弟之间传值

vue3开发中 父子传值,自定义事件传值,兄弟之间传值

1.父子之间传值,通过props进行传值

parent.vue 传值给儿子
在这里插入图片描述
child.vue这里进行接收
在这里插入图片描述
通过defineProps来接收数据

2.自定义事件传值

在这里插入图片描述
首先需要使用defineEmits拿到emit实例,通过点击事件,使用emit 发送自定义事件传递数据,
在这里插入图片描述
父亲这里定义自定义事件来接收参数

3.兄弟之间传值

可以使用mitt 事件总线来进行传值
先通过 npm install mitt 安装mitt
然后定义 bus/index 定义全局总线 $bus
在这里插入图片描述

在这里插入图片描述
通过$bus.emit(),进行传值
在这里插入图片描述
兄弟这里通过onMounted挂载的生命周期钩子里来接收数据
mitt中的方法
(1):on():用来绑定事件。

(2):emit():用来触发事件。

(3):off():用来解绑事件

(4):all:有clear属性,直接调用clear()属性可以解绑全部事件。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值