vue.prototype和vue.use的區(qū)別和注意點(diǎn)

1、vue.prototype：實(shí)例上掛載屬性/方法，例如Vue.prototype.axios=axios;

2、vue.use：引入插件，例如vuex，vue.use(vuex)

如圖，vue.use會(huì)初始化插件，運(yùn)行導(dǎo)出的intsall函數(shù)

// 使用插件Vuex //初始化插件Vue.use(plugin);區(qū)別：
1、不是為了vue寫的插件(插件內(nèi)要處理)不支持Vue.use()加載方式
2、非vue官方庫(kù)不支持new Vue()方式
3、每一個(gè)vue組件都是Vue的實(shí)例，所以組件內(nèi)this可以拿到Vue.prototype上添加的屬性和方法。

總結(jié)

Vue的插件是一個(gè)對(duì)象,
插件對(duì)象必須有install字段.
install字段是一個(gè)函數(shù).
初始化插件對(duì)象需要通過(guò)Vue.use()

補(bǔ)充：vue.prototype和vue.use的區(qū)別

Vue.use和Vue.prototype區(qū)別

• 相同點(diǎn)：都是注冊(cè)插件的方式，沒(méi)有本質(zhì)區(qū)別，都是在vue.prototype上添加了一個(gè)方法
• 不同點(diǎn)：vue.use適用于注冊(cè)vue生態(tài)內(nèi)的插件，vue.prototype適用于注冊(cè)生態(tài)外的插件

vue.prototype用法

需要設(shè)置全局變量，在main.js中，Vue實(shí)例化的代碼里添加。

不想污染全局作用域。這種情況下，你可以通過(guò)在 原型 上定義它們使其在每個(gè)Vue實(shí)例中可用。

vue.prototype.$echarts = echarts

Tips:變量前加上$，是防止被組件中的變量意外覆蓋

vue.use用法

• 通過(guò)全局方法Vue.use()使用插件
• Vue.usew會(huì)自動(dòng)阻止多次注冊(cè)插件
• 她需要在你調(diào)用new Vue()啟動(dòng)應(yīng)用之前完成

Tips:Vue.use() 方法至少傳入一個(gè)參數(shù)，該參數(shù)類型必須是 Object 或 Function，如果是 Object 那么這個(gè) Object 需要定義一個(gè) install 方法，如果是 Function 那么這個(gè)函數(shù)就被當(dāng)做 install 方法。在 Vue.use() 執(zhí)行時(shí) install 會(huì)默認(rèn)執(zhí)行，當(dāng) install 執(zhí)行時(shí)第一個(gè)參數(shù)就是 Vue，其他參數(shù)是 Vue.use() 執(zhí)行時(shí)傳入的其他參數(shù)。

到此這篇關(guān)于vue.prototype和vue.use的區(qū)別和注意點(diǎn)的文章就介紹到這了,更多相關(guān)vue.prototype和vue.use的區(qū)別內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！

最新評(píng)論