這篇文章主要介紹了vue.mixin的使用方法,具有一定借鑒價(jià)值,需要的朋友可以參考下。希望大家閱讀完這篇文章后大有收獲。下面讓小編帶著大家一起了解一下。
vue.mixin的使用方法:1、多個(gè)組件可以共享數(shù)據(jù)和方法,在使用mixin的組件中引入后,mixin中的方法和屬性也就并入到該組件中,可以直接使用;2、鉤子函數(shù)會(huì)兩個(gè)都被調(diào)用,mixin中的鉤子首先執(zhí)行。
vue.mixin的使用方法:
vue中提供了一種混合機(jī)制--mixins,用來(lái)更高效的實(shí)現(xiàn)組件內(nèi)容的復(fù)用。最開始我一度認(rèn)為這個(gè)和組件好像沒啥區(qū)別。。后來(lái)發(fā)現(xiàn)錯(cuò)了。下面我們來(lái)看看mixins和普通情況下引入組件有什么區(qū)別?
組件在引用之后相當(dāng)于在父組件內(nèi)開辟了一塊單獨(dú)的空間,來(lái)根據(jù)父組件props過(guò)來(lái)的值進(jìn)行相應(yīng)的操作,單本質(zhì)上兩者還是涇渭分明,相對(duì)獨(dú)立。
而mixins則是在引入組件之后,則是將組件內(nèi)部的內(nèi)容如data等方法、method等屬性與父組件相應(yīng)內(nèi)容進(jìn)行合并。相當(dāng)于在引入后,父組件的各種屬性方法都被擴(kuò)充了。
單純組件引用:
父組件 + 子組件 >>> 父組件 + 子組件
mixins:
父組件 + 子組件 >>> new父組件
作用:多個(gè)組件可以共享數(shù)據(jù)和方法,在使用mixin的組件中引入后,mixin中的方法和屬性也就并入到該組件中,可以直接使用。鉤子函數(shù)會(huì)兩個(gè)都被調(diào)用,mixin中的鉤子首先執(zhí)行。
下面給大家介紹vue mixin的用法,具體介紹如下所示:
1、定義一個(gè) js 文件(mixin.js)
export default { data() { return { name: 'mixin' } }, created() { console.log('mixin...', this.name); }, mounted() {}, methods: {} }
2、在vue文件中使用mixin
import mixin from '@/mixin'; // 引入mixin文件 export default { mixins: [mixin] }
感謝你能夠認(rèn)真閱讀完這篇文章,希望小編分享vue.mixin的使用方法內(nèi)容對(duì)大家有幫助,同時(shí)也希望大家多多支持創(chuàng)新互聯(lián)網(wǎng)站建設(shè)公司,,關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道,遇到問(wèn)題就找創(chuàng)新互聯(lián)網(wǎng)站建設(shè)公司,,詳細(xì)的解決方法等著你來(lái)學(xué)習(xí)!
本文題目:vue.mixin的使用方法-創(chuàng)新互聯(lián)
網(wǎng)站地址:http://chinadenli.net/article16/dgihdg.html
成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供手機(jī)網(wǎng)站建設(shè)、網(wǎng)頁(yè)設(shè)計(jì)公司、微信公眾號(hào)、網(wǎng)站設(shè)計(jì)、營(yíng)銷型網(wǎng)站建設(shè)、Google
聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請(qǐng)盡快告知,我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng),如需處理請(qǐng)聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時(shí)需注明來(lái)源: 創(chuàng)新互聯(lián)
猜你還喜歡下面的內(nèi)容