var Event = new Vue();//準備一個空的實例對象 //A組件 var A = {template: `<div><span>我是A組件的數據->pw_a</span><input type="button" value="把A數據傳給C" @click = "send"></div> `,methods: {send () {Event.$emit("a-msg", this.a);}},data () {return {a: "我是a組件中數據"}}}; //組件Bvar B = {template: `<div><span>我是B組件的數據->pw_a</span><input type="button" value="把B數據傳給C" @click = "send"></div> `,methods: {send () {Event.$emit("b-msg", this.a);}},data () {return {a: "我是b組件中數據"}}}; //組件Cvar C = {template: `<div><h3>我是C組件</h3><span>接收過來A的數據為: pw_a</span><br><span>接收過來B的數據為: pw_b</span></div> `,mounted () {//接收A組件的數據Event.$on("a-msg", function (a) {this.a = a;}.bind(this));//接收B組件的數據Event.$on("b-msg", function (a) {this.b = a;}.bind(this));},data () {return {a: "",b: ""}}};window.onload = function () {new Vue({el: "#box",components: {"dom-a": A,"dom-b": B,"dom-c": C}});};

?

轉載于:https://www.cnblogs.com/qqfontofweb/p/7574847.html

總結

以上是生活随笔為你收集整理的vuejs兄弟组件之间的通信的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。