在做各种程序开发时,最常用到的可能就是全局变量,那么利用 uni-app 框架开发小程序时则可以利用 app.vue 页面设置 globalDada 全局变量。globalData 是一种比较简单的全局变量使用方式。

uni-app globalData 全局变量

小程序中有个 globalData 概念,可以在 App 上声明全局变量。 Vue 之前是没有这类概念的,但 uni-app 引入了 globalData 概念,并且在包括 H5、App 等平台都实现了。

App.vue 页面定义和调用

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
<script>
	export default {
		globalData: {//全局数据
			domain: 'http://www.leixue.com', //域名,便于调用接口
			api: 'http://www.leixue.com/wp-json/app/v1/'
		},
		onLaunch: function() {
			console.log('App Launch');
			console.log(this.$options.globalData.domain);//获取全局变量
		},
		onShow: function() {
			console.log('App Show')
		},
		onHide: function() {
			console.log('App Hide')
		}
	}
</script>

在其他页面调用

1
2
3
4
5
6
7
8
9
10
11
<script>
	let App = getApp();
	var API = App.globalData.api;
	export default{
		onload:function(){
			//获取全局变量
			console.log(App.globalData.domain);
			console.log(API);
		}
	}
</script>

在 app.vue 页面获取 globalData 不能直接获取,要加一个$options;在其他页面调用要加通过 getApp()获取。

除非注明,否则均为泪雪博客原创文章,禁止任何形式转载

本文链接:https://zhangzifan.com/uni-app-globaldata.html

发表评论