vue组件间通信方式之父传子，子传父，兄弟相传

一、vue组件

组件是用来封装可重用代码，扩展html标签功能的一个拥有预定义选项的vue实例

组件与组件之间是相互独立、无法通信、可嵌套的

组件是可以被多次重复使用的

二、组件间的通信方式

1、父组件向子组件传值

2、父组件向子组件传值

• 在子组件中通过this.$emit('listenSon', msg)方法向父组件通信，如下

• 在父组件的子组件上绑定listenSon方法进行监听，绑定一个receive方法，当该方法触发时，执行父组件中相应的receive方法

 3、兄弟组件之间传值

• 兄弟组件之间通过事件中心进行通信

• 单独的事件中心管理组件间通信

  const eventHub = new Vue()

• 监听事件

  eventHub.$on('事件名称',function(参数,..){})

• 触发事件

  eventHub.$emit('兄弟事件名称',参数)

• 取消监听事件

  eventHub.$off('事件名称')

    

        
        
        取消事件监听