本文总结:
1、项目包含h5版本。
2、需要在onLaunch(当uni-app 初始化完成时触发)中请求接口返回结果,并且此结果在项目各个页面的onLoad(监听页面加载)中都有可能使用到。
3、考虑用户在各个页面中会有刷新操作。
满足以上3点的,还是不要用uni-app了。。
新的项目使用了uni-app搭建,一个使用 Vue.js 开发跨平台应用的前端框架,开发者编写一套代码,可编译到iOS、Android、H5、小程序等多个平台。
框架本身是基于vue的,与vue和微信小程序很相似,会这两个技术的同胞,入手应该没有难度。
一开始我们项目考虑做跨平台开发,但是最后只定了H5版本。
现在是碰到了一个坑,大家在选型的时候,考虑一下是否能规避。
框架本身有一个App.vue文件,其中有一个onLaunch方法,是应用的生命周期。
正常打开应用首页,先执行应用的生命周期onLaunch,再执行页面的生命周期onLoad。
但是,如果在onLaunch中,使用到了异步请求,且请求的结果(res)在页面中有使用到,则会出现页面onLoad中调用res时,请求还未得到res值,res值为空。
询问官方,得到的回复是,使用vuex,监听res值更新,更新后页面再去获取res值。根据官方回答,做出的解决方案:
computed: {
isToken() {
return this.$store.state.token
}
},
watch:{
isToken(val,oldVal) {
//token更新后,要做的操作
}
},
让人头大的是,我们的项目在onLaunch的生命周期中,请求接口返回登录token,token做了过期处理。应用中一半以上的接口都需要使用token去获取数据(大部分还是onLoad中就要调用的接口)。并且我们的项目是H5,在任何页面都能够刷新,一旦刷新则整个应用都会刷新。
也就意味着,我要在所有onLoad中使用到token的页面,都加上以上的监听。
这简直是一项累死人的操作。。。