小程序app.js异步请求+动态配置全局数据

app.js 若用缓存做全局配置

//app.js
App({
  onLaunch: function(options) {
    const that = this 

    wx.setStorageSync('a', '111')  
    wx.request({
      url: 'www.xx.com',
      success: function (res) {
        wx.setStorageSync('a', '222') 
      }
    })
  },

第一次加载index页面结果为111，点其他页面后再点击回来结果就是222，若是直接返回结果还是111
原因：因为请求是异步的，当再次加载页面，缓存才会是新的数据

//index.js
onLoad(){ 
    const a= wx.getStorageSync('a')
    console.log('a:',a)
  },

app.js 异步请求函数全局配置

//app.js
App({
  onLaunch: function(options) {
  },

  wxLogin() { 
    let that = this;
    return new Promise((resolve, reject) => {
      wx.request({
        url: 'www.xx.com',
        success: function(res) {
           that.globalData.web_name = '222'
           resolve(res.data)
        }
      })
    })
  }, 
  globalData: {
    web_name: '111'
  }
})

//index.js
const app = getApp()
Page({
  data: {
  },
  onLoad(){ 
     console.log('first:', app.globalData.web_name)     //111
     app.wxLogin().then(res => {      
       console.log('second:', app.globalData.web_name) //222
    });
     console.log('third:', app.globalData.web_name)     //111
  }
})

first:111
third:111
second:222

原因：

采用app.globalData数据做全局配置
异步请求数据并不会覆盖之前的数据
只有在异步请求回调内才是请求的数据
在app.js的onLaunch方法中调用wxLogin()，也不能全局配置

在app.js的onLaunch方法中调用

//app.js
  onLaunch: function(options) {
     const that = this
     this.wxLogin().then(res=>{
          console.log('app:', res.web_name)
          that.globalData.web_name = res.web_name      
      })
  }

//index.js
onLoad(){
  console.log('index:', app.globalData.web_name)
}

结果为：

index: 111
app: 222

就算是在初始化函数中调用异步，结果还是index.js先输出，异步后输出，异步数据仍然不能覆盖原数据
请求时做globalData判断，是否请求

总结

1、一步就实现异步数据全局调用：未找到解决办法
2、常用方法为：app.js中做一次请求，需要的页面去调用app.xx().then()方法，获取数据配置该页面。
3、优点是全局请求一次，数据是实时

若是在vue中

//main.js
//这里的http.get是封装的axios请求
Vue.prototype.siteinfo=http.get('webinfo').then(res=>{  
   return res.data 
}) 

//main.js
mounted() {       
    this.siteinfo.then(res=>{
      console.log('title:',res)   
    })
}