真实的国产乱ⅩXXX66竹夫人,五月香六月婷婷激情综合,亚洲日本VA一区二区三区,亚洲精品一区二区三区麻豆

成都創(chuàng)新互聯(lián)網(wǎng)站制作重慶分公司

Vue中mixin的用法詳解

說(shuō)下我對(duì)vue中mixin的一點(diǎn)理解

創(chuàng)新互聯(lián)主營(yíng)云霄網(wǎng)站建設(shè)的網(wǎng)絡(luò)公司,主營(yíng)網(wǎng)站建設(shè)方案,成都App制作,云霄h5微信平臺(tái)小程序開(kāi)發(fā)搭建,云霄網(wǎng)站營(yíng)銷推廣歡迎云霄等地區(qū)企業(yè)咨詢

vue中提供了一種混合機(jī)制--mixins,用來(lái)更高效的實(shí)現(xiàn)組件內(nèi)容的復(fù)用。最開(kāi)始我一度認(rèn)為這個(gè)和組件好像沒(méi)啥區(qū)別。。后來(lái)發(fā)現(xiàn)錯(cuò)了。下面我們來(lái)看看mixins和普通情況下引入組件有什么區(qū)別?

     組件在引用之后相當(dāng)于在父組件內(nèi)開(kā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: {}
}

關(guān)于用法,vue文檔中有詳細(xì)的介紹,這里只介紹怎么在一個(gè)vue文件中使用mixin。

2.在vue文件中使用mixin

import '@/mixin'; // 引入mixin文件
export default {
 mixins: [mixin]
}

總結(jié)

以上所述是小編給大家介紹的Vue 中mixin 的用法詳解,希望對(duì)大家有所幫助,如果大家有任何疑問(wèn)請(qǐng)給我留言,小編會(huì)及時(shí)回復(fù)大家的。在此也非常感謝大家對(duì)創(chuàng)新互聯(lián)網(wǎng)站的支持!


當(dāng)前題目:Vue中mixin的用法詳解
網(wǎng)站URL:http://weahome.cn/article/jpgdgj.html

其他資訊

在線咨詢

微信咨詢

電話咨詢

028-86922220(工作日)

18980820575(7×24)

提交需求

返回頂部