在Vue2中,保存全局变量都是在APP.vue中,如下:

调用的话直接调用如下:
一、对于自定义的globalData,需要在APP.vue声明,然后页面中调用const app = getApp();,然后使用app.globalData.xxx获取,如下:
二、对于Vue.prototype里面的数据,直接调用this.xxx调用:

在Vue3中,全局变量有变化如下:
一、对于自定义的globalData和vue2中声明及调用方式不变,需要在页面中调用const app = getApp();,然后使用app.globalData.xxx获取,如下:


二、对于Vue.prototype里面的数据,需要在main.js初始化:
import App from './App'
// #ifndef VUE3
import Vue from 'vue'
import './uni.promisify.adaptor'
Vue.config.productionTip = false
App.mpType = 'app'
const app = new Vue({
...App
})
app.$mount()
// #endif
// #ifdef VUE3
import {
createSSRApp
} from 'vue'
export function createApp() {
const app = createSSRApp(App)
app.config.globalProperties.statusHeight = uni.getWindowInfo().statusBarHeight;
app.config.globalProperties.windowWidth = uni.getWindowInfo().windowWidth;
app.config.globalProperties.safeAreaTop = uni.getWindowInfo().safeArea.top;
app.config.globalProperties.windowHeight = uni.getWindowInfo().windowHeight;
app.config.globalProperties.isUpiPhoneX = false;
const safeAreaBottom = uni.getWindowInfo().screenHeight - uni.getWindowInfo().safeArea.bottom
const menuButtonInfo = wx.getMenuButtonBoundingClientRect();
// app.config.globalProperties.navHeight = menuButtonInfo.bottom + menuButtonInfo.top - e
// .statusBarHeight;
app.config.globalProperties.navHeight = (menuButtonInfo.top - uni.getWindowInfo().statusBarHeight) * 2 +
menuButtonInfo.height + uni.getWindowInfo().statusBarHeight
app.config.globalProperties.menuTop = menuButtonInfo.top;
app.config.globalProperties.menuHeight = menuButtonInfo.height;
app.config.globalProperties.isiPhoneX = safeAreaBottom == 34 ? true : false;
// app.config.globalProperties.isiPhone11Pro = uni.getDeviceInfo().model.includes('iPhone 11 Pro') ? true : false;
app.config.globalProperties.safeAreaBottom = safeAreaBottom;
return {
app
}
}
// #endif
界面可以直接调用,js中需要声明一下getCurrentInstance参数,如下:
①界面调用:

②js调用:

