uni-app 中定义全局变量globalData注意事项

uni-app 关于全局变量有以下描述：

小程序中有个globalData概念，可以在 App 上声明全局变量。 Vue 之前是没有这类概念的，但 uni-app 引入了globalData概念，并且在包括H5、App等平台都实现了。
在 App.vue 可以定义 globalData ，也可以使用 API 读写这个值。

globalData支持vue和nvue共享数据。

<script>  
    export default {  
        globalData: {  
            text: 'text'  
        },  
        onLaunch: function() {  
            console.log('App Launch')  
        },  
        onShow: function() {  
            console.log('App Show')  
        },  
        onHide: function() {  
            console.log('App Hide')  
        }  
    }  
</script>  

<style>  
    /*每个页面公共css */  
</style>  

js中操作globalData的方式如下：

赋值：getApp().globalData.text = 'test'

取值：console.log(getApp().globalData.text) // 'test'

 

但使用的时候要注意，在onLaunch，onShow生命周期函数中不能直接使用getApp().globalData，会报错。猜测是因为getApp()在这两个生命周期函数中还没有创建出app实例。那怎么用呢？

<script>
	export default {
		globalData: {
			isIphoneX: false,
			provider: 'weixin' //'alipay' 'baidu' 'toutiao'
		},
		onLaunch: function() {
			console.log('App Launch')
			this.init()
		},
		onShow: function() {
			console.log('App Show')
			 setTimeout(() => {
			 	let provider = getApp().globalData.provider
			 	console.log(`globalData is: ${provider}`)
			 }, 0)
		},
		onHide: function() {
			console.log('App Hide')
		},
		methods: {
			init() {
				this.$nextTick(function(){
					let provider = getApp().globalData.provider
					console.log(`liubbc provider: ${provider}`)
				})
				let context = this
				uni.getSystemInfo({
					success: function(res) {
						context.globalData.isIphoneX = res.model.indexOf('iPhone X') != -1 ? true : false
					}
				})
				uni.getProvider({
					service: 'oauth',
					success: function(res) {
						context.globalData.provider = res.provider[0] || 'weixin'
					}
				});			
			},
		}
	}
</script>

<style>
	/*每个页面公共css */
	@import '@/common/css/common.css';
</style>

上面代码给出了正确的使用方式。