vue 組件

什么是組件：組件是可復用的vue實例，它的特點是獨立、可復用且整體化。

為什么要組件化：為了實現功能模塊的復用，高執行率，便于開發單頁面復雜應用。

組件化帶來的問題：組件狀態管理（vuex）；

多組件的混合使用，多頁面，復雜邏輯（vue-router）；

組件間的傳參、消息、事件處理（props，emit/on，bus）。

下面，我們來看看怎么創建組件以及使用組件，先注冊組件：Vue.component('componentName',{data:...,template:...})，componentName是你的組件名稱，data是組件的數據，切記data必須是一個函數，如果data只是一個對象，那我們在復用組件到的時候，組件和組件之間的數據是會受到彼此的影響的，template則是我們要建立的DOM模板內容。然后我們需要在哪里使用到這個組件，就把組件名當標簽使用在html里就可以來，我們來看一個小栗子：

前文提到的vuex，后面的文章會單獨將，它一種響應式的狀態管理，很重要，需要單獨來說?，F在，我們看一下組件之間的通信，vue通過prop向子組件傳遞數據。看下下面的例子：

如果我們需要給子組件添加事件，達到父子組件進行溝通的效果，應該怎么來實現呢，這就需要用到$emit 方法，這個方法第一個傳入一個事件名稱，這個事件名稱，我們能在父組件獲取并控制，后面還何以傳入其他參數，具體使用方法，可以看下官方文檔哈，我這里沒用就不說了。下面說個例子，我們在看小說的時候，有時候會用到放大字體或者縮小字體的功能，這里我們就通過給子組件添加兩個按鈕來實現一下這個功能：

除了上面我們說到的知識點，組件還有其他的知識點，我這里就先不說了，以后用到再補充吧，上面是組件基本的使用方法。

Vue

版權聲明：本文內容由網絡用戶投稿，版權歸原作者所有，本站不擁有其著作權，亦不承擔相應法律責任。如果您發現本站中有涉嫌抄襲或描述失實的內容，請聯系我們jiasou666@gmail.com 處理，核實后本網站將在24小時內刪除侵權內容。

版權聲明：本文內容由網絡用戶投稿，版權歸原作者所有，本站不擁有其著作權，亦不承擔相應法律責任。如果您發現本站中有涉嫌抄襲或描述失實的內容，請聯系我們jiasou666@gmail.com 處理，核實后本網站將在24小時內刪除侵權內容。