vue组件之间的传值
一.父组件向子组件传:1.在父组件的data中定义要传的值2.在父组件引用的子组件中用v-bind 绑定3.在子组件中用props定义父组件传的值,和v-bind对应4.在子组件用mustache使用props定义结果展示(props值不能修改)二.兄弟组件相互传值1.在两个兄弟组件中同时导入eventBus.js2.在发送数据的组件的data中定义发送数据,接受组件data中初始化接收值。3.发
·
一.父组件向子组件传:
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.
更多推荐
所有评论(0)