vue mixins和extends的妙用

2021-08-13 19:41:45 字數 987 閱讀 5922

vue提供了mixins、extends配置項,最近使用中發現很好用。如有不對請指正,感謝尤大提供搞笑生產工具。

看看官方文件怎麼寫的,其實兩個都可以理解為繼承,mixins接收物件陣列(可理解為多繼承),extends接收的是物件或函式(可理解為單繼承)。

繼承鉤子函式
const extend = 

}const mixin1 =

}const mixin2 =

}export default

}

控制台輸出

extends created

mixin1 created

mixin2 created

created

繼承methods
const extend = 

}}const mixin1 =

}}const mixin2 =

}}// name = 'name'

export default

}}

// 只寫出子類,name = 'mixin2 name',extends優先順序高會被mixins覆蓋

export default

// 只寫出子類,name = 'mixin1 name',mixins後面繼承會覆蓋前面的

export default

關於mixins和extend你可以理解為mvc的c(controller),這一層。可見通用的成員變數(包括屬性和方法)抽象成為乙個父類,提供給子類繼承,這樣可以讓子類擁有一些通用成員變數,然而子類也可以重寫父類的成員變數。這樣的整個程式設計思想就很物件導向,也就是繼承性。

vue mixins和extends的妙用

vue提供了mixins extends配置項,最近使用中發現很好用。如有不對請指正,感謝尤大提供搞笑生產工具。看看官方文件怎麼寫的,其實兩個都可以理解為繼承,mixins接收物件陣列 可理解為多繼承 extends接收的是物件或函式 可理解為單繼承 繼承鉤子函式 const extend cons...

Python中的append和extend的區別

網上有很多對這兩個函式的區別講解,但我覺得都講的不是很清楚,記憶不深刻。這樣解釋清楚且容易記住。list.extend sequence 把乙個序列seq的內容新增到列表中 music media compact disc 8 track tape long playing record new m...

vue mixins 合併策略

1 data mixins中的data會合併到data中,有衝突的話,data中資料覆蓋mixins中的資料。2 鉤子函式 mixins中的鉤子函式也會執行,先執行mixins中的鉤子函式。3 methods components和directives methods components和dire...