溫馨提示×
您好，登錄后才能下訂單哦！
點擊 登錄注冊 即表示同意《億速云用戶服務條款》
您好，登錄后才能下訂單哦！
這篇文章主要介紹了vue.mixin的使用方法，具有一定借鑒價值，需要的朋友可以參考下。希望大家閱讀完這篇文章后大有收獲。下面讓小編帶著大家一起了解一下。
vue.mixin的使用方法：1、多個組件可以共享數據和方法，在使用mixin的組件中引入后，mixin中的方法和屬性也就并入到該組件中，可以直接使用；2、鉤子函數會兩個都被調用，mixin中的鉤子首先執行。
vue.mixin的使用方法：
vue中提供了一種混合機制--mixins，用來更高效的實現組件內容的復用。最開始我一度認為這個和組件好像沒啥區別。。后來發現錯了。下面我們來看看mixins和普通情況下引入組件有什么區別？
組件在引用之后相當于在父組件內開辟了一塊單獨的空間，來根據父組件props過來的值進行相應的操作，單本質上兩者還是涇渭分明，相對獨立。
而mixins則是在引入組件之后，則是將組件內部的內容如data等方法、method等屬性與父組件相應內容進行合并。相當于在引入后，父組件的各種屬性方法都被擴充了。
單純組件引用：
父組件 + 子組件 >>> 父組件 + 子組件
mixins：
父組件 + 子組件 >>> new父組件
作用：多個組件可以共享數據和方法，在使用mixin的組件中引入后，mixin中的方法和屬性也就并入到該組件中，可以直接使用。鉤子函數會兩個都被調用，mixin中的鉤子首先執行。
下面給大家介紹vue mixin的用法，具體介紹如下所示：
1、定義一個 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]
}感謝你能夠認真閱讀完這篇文章，希望小編分享vue.mixin的使用方法內容對大家有幫助，同時也希望大家多多支持億速云，關注億速云行業資訊頻道，遇到問題就找億速云，詳細的解決方法等著你來學習!
免責聲明：本站發布的內容（圖片、視頻和文字）以原創、轉載和分享為主，文章觀點不代表本網站立場，如果涉及侵權請聯系站長郵箱：is@yisu.com進行舉報，并提供相關證據，一經查實，將立刻刪除涉嫌侵權內容。
