vue.prototype和vue.use的區(qū)別和注意點(diǎn)小結(jié)
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ì)象需要通過Vue.use()
補(bǔ)充:vue.prototype和vue.use的區(qū)別
Vue.use和Vue.prototype區(qū)別
- 相同點(diǎn):都是注冊(cè)插件的方式,沒有本質(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í)例化的代碼里添加。
不想污染全局作用域。這種情況下,你可以通過在 原型 上定義它們使其在每個(gè)Vue實(shí)例中可用。
vue.prototype.$echarts = echarts
Tips:變量前加上$,是防止被組件中的變量意外覆蓋
vue.use用法
- 通過全局方法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)文章希望大家以后多多支持腳本之家!
相關(guān)文章
Vue.js@2.6.10更新內(nèi)置錯(cuò)誤處機(jī)制Fundebug同步支持相應(yīng)錯(cuò)誤監(jiān)控
這篇文章主要介紹了Vue.js@2.6.10更新內(nèi)置錯(cuò)誤處機(jī)制,F(xiàn)undebug同步支持相應(yīng)錯(cuò)誤監(jiān)控 ,需要的朋友可以參考下2019-05-05
Mpvue中使用Vant Weapp組件庫(kù)的方法步驟
這篇文章主要介紹了Mpvue中使用Vant Weapp組件庫(kù)的方法步驟,小編覺得挺不錯(cuò)的,現(xiàn)在分享給大家,也給大家做個(gè)參考。一起跟隨小編過來(lái)看看吧2019-05-05
vue單頁(yè)面應(yīng)用打開新窗口顯示跳轉(zhuǎn)頁(yè)面的實(shí)例
今天小編就為大家分享一篇vue單頁(yè)面應(yīng)用打開新窗口顯示跳轉(zhuǎn)頁(yè)面的實(shí)例,具有很好的參考價(jià)值,希望對(duì)大家有所幫助。一起跟隨小編過來(lái)看看吧2018-09-09
在vue中通過render函數(shù)給子組件設(shè)置ref操作
這篇文章主要介紹了在vue中通過render函數(shù)給子組件設(shè)置ref操作,具有很好的參考價(jià)值,希望對(duì)大家有所幫助。一起跟隨小編過來(lái)看看吧2020-11-11
Vue項(xiàng)目中ESLint配置超全指南(VScode)
ESLint是一個(gè)代碼檢查工具,用來(lái)檢查你的代碼是否符合指定的規(guī)范,下面這篇文章主要給大家介紹了關(guān)于Vue項(xiàng)目中ESLint配置(VScode)的相關(guān)資料,文中通過實(shí)例代碼介紹的非常詳細(xì),需要的朋友可以參考下2023-04-04
vue?頂部消息橫向滾動(dòng)通知效果實(shí)現(xiàn)
系統(tǒng)頂部展示一個(gè)橫向滾動(dòng)的消息通知,就是消息內(nèi)容從右往左一直滾動(dòng),這篇文章主要介紹了vue頂部消息橫向滾動(dòng)通知,需要的朋友可以參考下2024-02-02
vue3.0 Reactive數(shù)據(jù)更新頁(yè)面沒有刷新的問題
這篇文章主要介紹了vue3.0 Reactive數(shù)據(jù)更新頁(yè)面沒有刷新的問題,具有很好的參考價(jià)值,希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方,望不吝賜教2023-04-04

