vue中mixins的使用方法和注意點（詳）

mixins基礎概況

vue中的解釋是這樣的，若是以爲語言枯燥的能夠自行跳過嘿~

混入 (mixins)： 是一種分發 Vue 組件中可複用功能的很是靈活的方式。混入對象能夠包含任意組件選項。當組件使用混入對象時，全部混入對象的選項將被混入該組件自己的選項。

怎麼用？

舉個栗子：

• 定義一個混入對象

• 把混入對象混入到當前的組件中

用法似不似至關簡單呀

mixins的特色

1 方法和參數在各組件中不共享

混合對象中的參數num

組件1中的參數num進行+1的操做

組件2中的參數num未進行操做

看兩組件中分別輸出的num值

你們能夠看到，我在組件1裏改變了num裏面的值，組件2中的num值仍是混入對象裏的初始值

2 值爲對象的選項，如methods,components等，選項會被合併，鍵衝突的組件會覆蓋混入對象的

混入對象中的方法

組件中的方法

打印臺的輸出

3 值爲函數的選項，如created,mounted等，就會被合併調用，混合對象裏的鉤子函數在組件裏的鉤子函數以前調用

混入對象函數中的console

組件函數中的console

打印臺的打印

與vuex的區別

通過上面的例子以後，他們之間的區別應該很明顯了哈~

• vuex：用來作狀態管理的，裏面定義的變量在每一個組件中都可以使用和修改，在任一組件中修改此變量的值以後，其餘組件中此變量的值也會隨之修改。

• Mixins：能夠定義共用的變量，在每一個組件中使用，引入組件中以後，各個變量是相互獨立的，值的修改在組件中不會相互影響。

與公共組件的區別

一樣明顯的區別來再列一遍哈~

• 組件：在父組件中引入組件，至關於在父組件中給出一片獨立的空間供子組件使用，而後根據props來傳值，但本質上二者是相對獨立的。

• Mixins：則是在引入組件以後與組件中的對象和方法進行合併，至關於擴展了父組件的對象與方法，能夠理解爲造成了一個新的組件。

當mixins裏有異步請求的時候，在組件中怎麼獲取異步請求的返回值，請看下一篇
vue中mixins的使用方法和注意點（詳2）(異步請求的狀況)