码迷,mamicode.com
首页 > 其他好文 > 详细

vue中组件之间的传值

时间:2019-09-16 23:43:37      阅读:117      评论:0      收藏:0      [点我收藏+]

标签:中间   bind   mit   eve   参考   this   注意   htm   target   

按照对象分类:

一、父子组件之间的传值

1.使用props和$emit

2.在引入的子组件中使用ref,通过this.$refs.xxx.方法/值来获取子组件中的方法或者值

3.子组件中使用this.$parent来获取父组件中的值或者方法

4.父组件中使用this.$children来获取子组件中的值或者方法

 

二、兄弟组件中的传值

1.使用eventBus作为中间件,然后使用$emit去抛出事件,使用$on去监听事件

这里要注意一些事项:a.bus.$emit在beforeDestroy中去触发

b.bus.$on 在 created或者mounted中使用,且回调函数使用箭头函数,解决this指向问题

c.在beforeDestroy中使用bus.$off去销毁事件

详细参考点击链接

 

三、多级组件嵌套传值

1.使用 v-bind = "$attrs" v-on = "$listeners"

详情参考点击链接

2.使用provide和inject

 

四、多个组件重复使用,整个项目都需要的

1.使用vuex

 

vue中组件之间的传值

标签:中间   bind   mit   eve   参考   this   注意   htm   target   

原文地址:https://www.cnblogs.com/lanhuo666/p/11273128.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!