当前位置: 首页 > 工具软件 > AppJS > 使用案例 >

小程序首页接口调用app.js中异步调用返回的值

诸葛品
2023-12-01

原因

因为app.js中的onLaunch是异步的,当小程序首页打开的时候,app.js中在onLaunch里的接口还没有通没有返回值,也就没有办法设置相应的globalData,但index.js已经执行了,当然就拿不到在app.js中动态设置的globalData的值了,我们需要的是onLaunch请求完之后,再执行index.js中的onLoad方法

解决办法

在首页index.js中先判断一下当前app.globalData.testData是否有值,如果有则正常操作,如果没有(第一次)则定义定义一个app方法(回调函数)app.testDataCallback = testData => {…},app.js在请求success里,判断index.js是否定义了回调方法,如果有就执行该方法。因为回调函数是在index.js中定义的方法,所以作用域 this 指向index页面,下面我们看下示例代码。

//app.js
App({
	onLaunch: function () {
		wx.request({
			url: 'https://www.xxx.com/test', //示例接口
			data: {
			},
			success: function(res) {
			//设置全局变量
			this.globalData.testData = res.testData;
			//由于这里是网络请求,可能会在 Page.onLoad 之后才返回 所以此处加入 callback 以防止这种情况
				if (this.testDataCallback){
					this.testDataCallback(res.testData);
				}
			}
		})
	}
})
//index.js
//获取应用实例
const app = getApp()
Page({
	onLoad: function () {
	//判断是否获取到动态设置的globalData
	if (app.globalData.testData && app.globalData.testData != '') {
		//调用首页接口
	} else {
		// 声明回调函数获取app.js onLaunch中接口调用成功后设置的globalData数据
			app.testDataCallback = testData => {
				if (testData != '') {
				//调用首页接口
				}
			}
	}
	}
})
 类似资料: