組件-任意平行組件之間的通信
阿新 • • 發佈：2018-01-30
另一個 charset utf con doc hang 裏的 發的 信號
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <style> </style> </head> <body> <div id="app"> <huahua></huahua> <shuandan></shuandan> </div> <script src="../lib/vue.js"></script> <script src="js/main.js"></script> </body> </html>
var Event = new Vue(); //時間調度去,兩個組件之間通信應該有一個中間人 Vue.component("huahua",{ template:` <div>我說：<input @keyup="on_change" type="text" v-model="i_sad"></div> `, methods:{ on_change:function () { Event.$emit("huahua-said-something",this.i_sad) //這裏的this.i_sad相當於吧一個組件發的信號串到另一個區 } }, data:function () { return { i_sad:"", } } }); Vue.component("shuandan",{ template:‘<div>花花說：{{huahua_said}}</div>‘, data:function () { return { huahua_said:"" } }, mounted:function () { var me = this; Event.$on("huahua-said-something",function (data) { //on 表示監聽一個事件 console.log(data); me.huahua_said = data }) } }); new Vue({ el:"#app" });
組件-任意平行組件之間的通信