vuejs 傳值給組件專題及常見問題 - CSDN

當父組件要給孫子，或者孫子與孫子要傳值的時候怎麼傳，一層一層傳太麻煩了，vuejs提供了一中模式叫發布訂閱模式（觀察者模式，bus，總線）來處理非父子組件間的傳值

 

<div id='root'>　　<child content = 'Dell'></child>　　<child content = 'Lee'></child></div><script>Vue.prototype.bus = new Vue();Vue.component('child',{　　props:{　　　　content:String　　},　　data:function(){　　　　return {　　　　　　selfContent:this.content　　　　}　　},　　template:'<div @click="handleClick">{{this.selfContent}}</div>',　　methods:{　　　　handleClick:function(){　　　　　　this.bus.$emit('change',this.selfContent)　　　　}　　},　　mounted:function(){////頁面已經被渲染完畢了的時候被執行　　　　var that = this;　　　　this.bus.$on('change',function(msg){　　　　　　that.selfContent = msg;　　　　})　　}})var vm = new Vue({　　el:'#root',　　methods:{　　　　handleClick:function(){　　　　　　alert(1);　　　　}　　}})</script>