vue的父子兄弟组件传递

之前学习过vue但是跟着视频学习并没有敲代码,感觉一知半解,这里做一个总结,方便自己理解以及以后工作的开展

首先关于父子组件的传递
1.父传子

父传子(其实就是父组件用v-bind给子组件绑定数据,子组件用props接收)要注意的几个点:
1.在父组件中要包含有子组件的存在
2.在父组件部分包含的子组件需要使用v-bind来绑定上数据(否则在子组件部分值就会undefined)
3.在子组件的部分使用props来进行接收
源代码如下:
父组件:
在这里插入图片描述
子组件:
在这里插入图片描述
运行效果:
在这里插入图片描述

2.子传父

关于子传父(子组件需要设置一个触发事件来传递参数,通过emit的方式,父组件在子标签上监听函数,来获取值),需要注意的几点:1.触发函数中this.emit的方式,父组件在子标签上监听函数,来获取值),需要注意的几点: 1.触发函数中 this.emit1.this.emit(‘乱想的名字’,‘真实参数’);
2.在父组件中的子标签中监听该函数,需要设置函数实现
源代码:
子组件:
在这里插入图片描述
父组件:

在这里插入图片描述
运行结果:
在这里插入图片描述

然后关于兄弟组件的传递
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值