元件分為全域性的和區域性的。
檢視線上演示效果
-- todo
這裡後期根據應用談一下兩者的好處和實際應用
元件的data 必須是乙個函式
vue.component('******-counter', }',
// 技術上 data 的確是乙個函式了，因此 vue 不會警告，
// 但是我們卻給每個元件例項返回了同乙個物件的引用
data: function ()
}})new vue()
// 註冊
vue.component('child', }'
})// 建立根例項
new vue(
})在 vue 中，父子元件的關係可以總結為 prop 向下傳遞，事件向上傳遞。父元件通過 prop 給子元件下發資料，子元件通過事件給父元件傳送訊息。
父元件是使用 props 傳遞資料給子元件，但如果子元件要把資料傳遞回去，就需要使用自定義事件！以下例項中子元件已經和它外部完全解耦了。它所做的只是觸發乙個父元件關心的內部事件。我們可以使用 v-on 繫結自定義事件, 每個 vue 例項都實現了事件介面(events inte***ce)，即：
使用 $on(eventname) 監聽事件
使用 $emit(eventname) 觸發事件
另外，父元件可以在使用子元件的地方直接用 v-on 來監聽子元件觸發的事件。
手把手教你學vue 4（vuex）
管理統一元件狀態state。每個應用將僅僅包含乙個 store 例項。單一狀態樹讓我們能夠直接地定位任一特定的狀態片段，在除錯的過程中也能輕易地取得整個當前應用狀態的快照。vuex 通過 store 選項，提供了一種機制將狀態從根元件 注入 到每乙個子元件中 需呼叫 vue.use vuex 把 s...
Vue2 元件封裝
接觸乙個前端框架，除了基礎的使用語法以外我們接下來都會很關心元件和復用的問題。以下就是個簡單的例子。下面是在父元件中引入子元件的 片段 booklist out container booklist container for book in books book book div button c...
vue 2 元件之間傳值
對vue2版本的元件之間傳值的乙個簡單整合 父元件 子元件 props 和 refs props parent this.ref.helloworld.msg子元件 父元件 自定義事件 child this.emit send msg parent 兄弟元件 通過共同祖輩搭橋 par ent或 pa...