vue组件之间的传值

一.父组件向子组件传:

1.在父组件的data中定义要传的值

2.在父组件引用的子组件中用v-bind 绑定

3.在子组件中用props定义父组件传的值,和v-bind对应

 4.在子组件用mustache使用props定义

结果展示(props值不能修改)

二.兄弟组件相互传值

1.在两个兄弟组件中同时导入eventBus.js

 2.在发送数据的组件的data中定义发送数据,接受组件data中初始化接收值。

3.发送组件用函数调用bus.$emit方法(可以用click事件,也可用生命周期,具体看需求)

4.接收组件在生命周期created()调用bus.$on方法,接收值。

 5.接受组件用mustache使用接收到的值

效果展示(用按钮点击事件绑定函数)

left组件点击“发送数据”,right组件初始化接收值为“ qqq”

 点击触发bus.$emit(),right组件初始化接收值“qqq”,变成了left发送的值。

三.子组件向父组件传值

1.

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值