Vuejs2 0 元件通訊總結

父元件資料如何傳遞給子元件呢？可以通過props屬性來實現

父元件：

<

parent
>
<
child :child
-msg
="msg"
><
/child
>
//最好用 - 代替駝峰，不區分大小寫
<
/parent
> 
data
(); }

子元件通過props來接收資料: 

方式1：

props: ['childmsg']

props

:

props: 

}

那麼，如果子元件想要改變資料呢？這在vue中是不允許的，因為vue只允許單向資料傳遞，這時候我們可以通過觸發事件來通知父元件改變資料，從而達到改變子元件資料的目的.

子元件:

<
div@click=
"up"
>
div> 
methods: 
}

<

div>
:msg="msg">
child>
//監聽子元件觸發的upup事件,然後呼叫change方法
div>
methods: 
}

如果2個元件不是父子元件那麼如何通訊呢？這時可以通過eventhub來實現通訊. 

所謂eventhub就是建立乙個事件中心，相當於中轉站，可以用它來傳遞事件和接收事件.

let hub = new vue(); //建立事件中心

<

div@click="eve">
methods
: }

created() ); }

vue 2 0 元件 父子元件通訊

示例 輸入框 通過this.emit input value 將將使用者的之輸出到v model繫結的值 randomid v bind value value v on input oninput 複製 export default data function methods 複製 msg 複製 ...

VUE 元件（二）元件通訊

元件關係可分為父子元件通訊 兄弟元件通訊 跨級元件通訊。一 自定義事件 當子元件向父元件傳遞資料時，就要用到自定義事件 子元件用 emit 來觸發事件，父元件用 on 來監聽子元件事件 通過兩個按鈕實現 1 1的效果，在改變元件data中的count後，通過 emit 將值傳給父元件，父元件用v o...

vue2 0 元件通訊 非vuex法

寫在前面 1.父元件的data寫法與子元件的data寫法不同 父元件data 子元件 data function 2.引用子元件遵循 以下例項全部使用以下模板 父元件 呼叫子元件 子元件 1.父子通訊 之 靜態資料 如果只是傳單一的字串 props nums nums 為字串 total 這樣子元件...