vue 组件间传值总结

从父组件传给子组件

（1）通过属性传递 

//child  

props: ["title"],

// parent

<child1 :title="title1" @getmsg="getmsg"></child1>

（2）引用refs

<HelloWord ref="hw"/>

this.$refs.hw.xx

2,通过事件传递,子组件=》父组件

// child

this.$emit('getmsg', good)

// parent

<child1 :title="title1" @getmsg="getmsg"></child1>

3，父组件传后代

<button @click="$boardcast('boardcast','我是Child1')">广播子元素</button>

 this.$on("boardcast", msg => {
      this.msg = "接收boardcast消息:" + msg;
    });

4，父组件传后代

  provide: {
    woniu: "我是骚气的Jerry老师"
  },

  inject: ["woniu"],
5，子向祖先传递

<button @click="$dispatch('dispatch','哈喽 我是GrandGrandChild1')">dispatch</button>

  this.$on("dispatch", msg => {
      this.msg = "接收dispatch消息:" + msg;
    });

6，向任何组件传递方法bus

       <button @click="eventBus">$bus发布</button>

      eventBus(){
            this.$bus.$emit('event-bus','测试eventBus')
        }

this.$bus.$on("event-bus", msg => {
      this.msg = "接收event-bus消息:" + msg;
    });

7，同级间组件传递

vm.$on('test', function (msg) {
  console.log(msg)
})
vm.$emit('test', 'hi')