元件（component）是 vue.js 最強大的功能之一。
元件可以擴充套件 html 元素，封裝可重用的**。
元件系統讓我們可以用獨立可復用的小組件來構建大型應用，幾乎任意型別的應用的介面都可以抽象為乙個元件樹：
上面展示的可以引入所有 vue 元件的關係形式：
使用props，父元件可以使用props向子元件傳遞資料。
父元件
子元件
}父元件向子元件傳遞事件方法，子元件通過$emit觸發事件，**給父元件。
父元件
子元件
在上面的例子中，有父元件 father 和子元件 son。
第一種方式處理父子元件之間的資料傳輸有乙個問題：如果父元件a下面有子元件b，元件b下面有元件c,這時如果元件a想傳遞資料給元件c怎麼辦呢？
如果採用第一種方法，我們必須讓元件a通過prop傳遞訊息給元件b，元件b在通過prop傳遞訊息給元件c；要是元件a和元件c之間有更多的元件，那採用這種方式就很複雜了。vue 2.4開始提供了$attrs和$listeners來解決這個問題，能夠讓元件a之間傳遞訊息給元件c。
父元件
我是父元件子元件
我是子元件孫元件
我是孫元件在上面的例子中，我們定義了 父，子，孫 三個元件，其中元件子是元件父的子元件，元件孫是元件子的子元件。} }
父元件通過v-model傳遞值給子元件時，會自動傳遞乙個value的prop屬性，在子元件中通過this.$emit(『input', val)自動修改v-model繫結的值
父元件
我是父元件子元件}
我是子元件在上面的例項**中，我們定義了 father 和 son 兩個元件，這兩個元件是父子關係，v-model 也只能實現父子元件之間的通訊。
父元件中通過provider來提供變數，然後在子元件中通過inject來注入變數。不論子元件有多深，只要呼叫了inject那麼就可以注入provider中的資料。而不是侷限於只能從當前父元件的prop屬性來獲取資料，只要在父元件的生命週期內，子元件都可以呼叫。
父元件
我是父元件子元件
我是子元件在上面的例項中，我們定義了元件} //
會顯示中午一起吃飯
father和元件son，元件 father 和元件 son 是父子關係。
這裡要說的這種方式就比較直觀了，直接操作父子元件的例項。$parent就是父元件的例項物件，而$children就是當前例項的直接子元件例項了，不過這個屬性值是陣列型別的，且並不保證順序，也不是響應式的。
父元件
我是父元件子元件test
我是子元件在上面例項**中，分別定義了 father 和 son 元件，這兩個元件是直接的父子關係。兩個元件分別在內部定義了自己的屬性。在 father 元件中，直接通過
this.$children[0].sonmessage = 'hello';給son元件內的 sonmessage屬性賦值，而在 son 子元件中，同樣也是直接通過this.$parent.fathermessage給father元件中的 fathermessage 賦值，形成了父子元件通訊。
對於父子元件之間的通訊，上面的兩種方式是完全可以實現的，但是對於兩個元件不是父子關係，那麼又該如何實現通訊呢？在專案規模不大的情況下，完全可以使用**事件匯流排eventbus的方式。
在元件之外定義乙個bus.js作為元件間通訊的橋梁，適用於比較小型不需要vuex又需要兄弟元件通訊的
1. bus.js中新增如下
import vue from 'vue'export const bus = new vue();2.元件中呼叫bus.js通過自定義事件傳遞資料
import bus from './bus.js'export3.兄弟元件中監聽事件接受資料default}}
import bus from './bus.js'export**事件匯流排default
) }
}
eventbus非常簡單，就是任意元件和元件之間打交道，沒有多餘的業務邏輯，只需要在狀態變化元件觸發乙個事件，然後在處理邏輯元件監聽該事件就可以。 vue元件間通訊
1 父元件向子元件傳遞資料，只需要props就行。設定資料並繫結到元件上。子元件用props接收，就能在元件內部使用獲取到的資料 反向通訊則需要在父級元件上自定義對應的方法，子元件使用 emit呼叫父元件方法，並上傳資料 content date content.vue date.vue 上面這個例...
vue元件間通訊
參考文章 vue父子元件間通訊可以用prop完成，跨級通訊則要用attrs來實現。1.attrs實現跨級通訊 父親元件 father元件 p msg1 p msg1 msg1 msg2 msg2 msg3 msg3 msg4 msg4 title 乙個標題 son1 div template imp...
vue元件間通訊
a元件要傳遞資料給b元件 a元件是有資料的，b元件是需要資料的 vue的各個元件data是不共享的，但是我們有時需要傳遞資料，那麼就可以使用vuex的store，store是乙個物件，裡面有個state，用來儲存多個元件需要使用的資料 我們先定義資料 在store的state中，定義資料 然後 在s...