个人应用场景:
1.进入小程序会请求一个接口,获取小程序信息和用户信息。 例如:unionId appid openId等,小程序未进行按钮授权操作。
2.再通过点击按钮查询,请求查询信息
问题:执行顺序必须先等待第一个接口返回信息,后端需要unionId appid等,再启动时请求如果网速原因导致接口响应过慢,直接点击查询,导致没有unionId appid等信息而报错
解决办法:
1.npm install --save mobx-miniprogram mobx-miniprogram-bindings 安装 小程序的 MobX 绑定辅助库
2.构建npm
3.根目录下创建store文件 并创建index.js文件 内容如下
import { observable, action } from 'mobx-miniprogram'
export const store = observable({
autoBtn: true,
setAutoBtn: action(function (data) {
console.log(this.autoBtn,data,'dd');
this.autoBtn = data
}),
})
4.到当前需要操作的页面配置如下:(我的是查询页)
import { createStoreBindings } from 'mobx-miniprogram-bindings'
import { store } from '../../store/index'
onUnload() {
// 解绑
this.storeBindings.destroyStoreBindings()
},
onReady() {
console.log(1112);
this.storeBindings = createStoreBindings(this, {
store,
fields: ['autoBtn'],
})
},
5.由于我再app.js中触发第一个接口(获取 unionId appid ),所以我再app.js中引入
import { createStoreBindings} from 'mobx-miniprogram-bindings'
import {store} from './store/index'
//self let self = this;
self.storeBindings = createStoreBindings(self, {
store,
fields: ['autoBtn'],
actions: ['setAutoBtn'],
})
self.setAutoBtn(false)
由于我在app.js中对autoBtn进行处理 控制到报错并阻塞代码
处理:
对miniprogram_npm文件下的mobx-miniprogr.setData?r.setData(o):''ram-bindings下的index.js中的r.setData(o)替换为r.setData?r.setData(o):''
//问题产生原因是因为app.js中没有setData