web項目開發(fā)VUE的混入與繼承原理
更新時間：2021年09月23日 15:39:39 作者：SpringSir
這篇文章主要介紹了web項目開發(fā)中VUE的混入與繼承原理，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進步，早日升職加薪
混入
- 將多個vue文件內重復使用的功能代碼，提取成單個js文件，在需要使用的地方進行調用即可。
- 在一個js文件內定義一個對象, 在對象中可以寫 vue文件內的 data 、methods、components等所有<script>中可以定義的代碼。
混入注意(重名情況)
- 組件中的 data變量名 和 混入中的 data變量 名, 發(fā)生重名時, 以組件為準;
- 組件中的 methods，computed，wath名稱 和 混入中的 methods，computed，wath名稱 名, 發(fā)生重名時, 以組件為準;
- 組件中的 生命鉤子函數(shù) 和 混入中的 生命鉤子函數(shù) 名, 發(fā)生重名時, 都會執(zhí)行, 但是組件中的鉤子函數(shù)優(yōu)先執(zhí)行 ;
局部混入
全局混入
定義及全局注冊
調用
繼承
- 注意：這里是不適合多繼承的，多繼承問題出現(xiàn)會多。
- extends除了可以繼承 .vue 文件，而且可以和 mixin一樣使用 js文件內的對象。
- extends繼承 .vue 文件內的 template內的html是無法繼承的
混入和繼承的區(qū)別
- 先看看官方文檔的定義, 其實兩個都可以理解為繼承;
- mixins接收對象數(shù)組（可理解為多繼承）;
- extends接收的是對象或函數(shù)（可理解為單繼承）。
- 注意: 如果一個組件, 既使用 繼承, 又使用 混入, 它們二者中如果有重名, 則混入會覆蓋繼承
以上就是web項目開發(fā)VUE的混入與繼承原理的詳細內容，更多關于web開發(fā)的資料請關注腳本之家其它相關文章！
相關文章
這篇文章主要介紹了詳解Vue源碼之數(shù)據(jù)的代理訪問，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2018-12-12
vue-cli單頁面預渲染seo-prerender-spa-plugin操作
這篇文章主要介紹了vue-cli單頁面預渲染seo-prerender-spa-plugin操作，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧2020-08-08
Element-ui DatePicker顯示周數(shù)的方法示例
這篇文章主要介紹了Element-ui DatePicker顯示周數(shù)的方法示例，文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值，需要的朋友們下面隨著小編來一起學習學習吧2019-07-07
vue3+ts項目之安裝eslint、prettier和sass的詳細過程
這篇文章主要介紹了vue3+ts項目02-安裝eslint、prettier和sass的詳細過程,在本文講解中需要注意執(zhí)行yarn format會自動格式化css、js、html、json還有markdown代碼，需要的朋友可以參考下2023-10-10
el-form表單el-form-item label不換行問題及解決
這篇文章主要介紹了el-form表單el-form-item label不換行問題及解決方案,具有很好的參考價值,希望對大家有所幫助,如有錯誤或未考慮完全的地方,望不吝賜教2023-10-10
這篇文章主要介紹了Vue2.0 事件的廣播與接收(觀察者模式)，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2018-03-03
vue如何解決el-select下拉框顯示ID不顯示label問題
這篇文章主要介紹了vue如何解決el-select下拉框顯示ID不顯示label問題，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2023-06-06
這篇文章主要介紹了詳解Vue template 如何支持多個根結點，文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值，需要的朋友們下面隨著小編來一起學習學習吧2020-02-02
webpack+vue-cil 中proxyTable配置接口地址代理操作
這篇文章主要介紹了webpack+vue-cil 中proxyTable配置接口地址代理操作，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧2020-07-07
這篇文章主要介紹了vue如何實現(xiàn)多組關鍵詞對應高亮顯示問題,具有很好的參考價值,希望對大家有所幫助,如有錯誤或未考慮完全的地方,望不吝賜教2023-10-10