Vue3實現(xiàn)掛載全局方法和用getCurrentInstance代替this
更新時間：2025年04月19日 08:43:12 作者：發(fā)奮圖強_lee
這篇文章主要介紹了Vue3實現(xiàn)掛載全局方法和用getCurrentInstance代替this,具有很好的參考價值,希望對大家有所幫助,如有錯誤或未考慮完全的地方,望不吝賜教
Vue3掛載全局方法和用getCurrentInstance代替this
平時我們在開發(fā)vue項目的時候，要把一些函數(shù)、方法、組件或插件掛在全局上方便項目上每一個頁面或模塊調用，在vue2.x的時候，在main.js只要用Vue.prototype就能完成，之后在頁面上用this來調用，如：
main.js:
調用
在vue3.0的時候掛在全局方法就不一樣，通過 app.config.globalProperties來掛載，如掛載axios：
方法一
但是切記掛載任何東西之前不能createApp(App)后面不能連綴use()或mount('#app')，如：
或者
方法二
把封裝的函數(shù)和api掛載在全局變量install方法里，之后導出
在main.js 引入，
但是在vue3.0的時候如果用組合api，由于 setup 在生命周期 beforecreate 和 created 前執(zhí)行，此時 vue 對象還未創(chuàng)建，因無法使用我們在 vue2.x 常用的 this。
那就用 getCurrentInstance代替this，首先引入，之后聲明如下：
總結
以上為個人經(jīng)驗，希望能給大家一個參考，也希望大家多多支持腳本之家。
相關文章
Vue使用wangEditor實現(xiàn)自定義粘貼功能
這篇文章主要為大家詳細介紹了Vue如何使用wangEditor實現(xiàn)自定義粘貼功能,文中的示例代碼講解詳細,感興趣的小伙伴可以跟隨小編一起學習一下2024-12-12
這篇文章主要介紹了vue新建項目并配置標準路由過程解析,文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值,需要的朋友可以參考下2019-12-12
本文主要介紹了vue?文件切片上傳的項目實現(xiàn)，文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值，需要的朋友們下面隨著小編來一起學習學習吧2023-03-03
vue中watch和computed為什么能監(jiān)聽到數(shù)據(jù)的改變以及不同之處
這篇文章主要介紹了vue中watch和computed為什么能監(jiān)聽到數(shù)據(jù)的改變以及不同之處,本文通過實例代碼給大家介紹的非常詳細，具有一定的參考借鑒價值，需要的朋友可以參考下2019-12-12
這篇文章主要介紹了使用vue實現(xiàn)HTML頁面生成圖片的相關知識，本文通過實例代碼給大家介紹的非常詳細，對大家的學習或工作具有一定的參考借鑒價值,需要的朋友可以參考下2020-03-03
解決vue中數(shù)據(jù)更新視圖不更新問題this.$set()方法
這篇文章主要介紹了解決vue中數(shù)據(jù)更新視圖不更新問題this.$set()方法，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2022-06-06
下面小編就為大家?guī)硪黄獀ue2.X組件學習心得(新手必看篇)。小編覺得挺不錯的，現(xiàn)在就分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2017-07-07
這篇文章主要介紹了vue中的計算屬性傳參，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2022-08-08
vue前端開發(fā)輔助函數(shù)狀態(tài)管理詳解示例
vue的應用狀態(tài)管理提供了mapState、mapGetters、mapMutations、mapActions四個輔助函數(shù)，所謂的輔助函數(shù)分別對State、Getters、Mutations、Actions在完成狀態(tài)的使用進行簡化2021-10-10
vue通過elementUI組件實現(xiàn)圖片預覽效果
我們在開發(fā)中經(jīng)常會遇到通過點擊某個按鈕或者文字實現(xiàn)圖片的預覽功能,這里我們分別介紹vue2和vue3里面如何實現(xiàn)圖片預覽方法,需要的朋友可以參考下2023-09-09