uni-app中onLaunch内的异步方法处理

本文总结：
1、项目包含h5版本。
2、需要在onLaunch（当uni-app 初始化完成时触发）中请求接口返回结果，并且此结果在项目各个页面的onLoad（监听页面加载）中都有可能使用到。
3、考虑用户在各个页面中会有刷新操作。
满足以上3点的，还是不要用uni-app了。。

---

新的项目使用了uni-app搭建，一个使用 Vue.js 开发跨平台应用的前端框架，开发者编写一套代码，可编译到iOS、Android、H5、小程序等多个平台。

框架本身是基于vue的，与vue和微信小程序很相似，会这两个技术的同胞，入手应该没有难度。

一开始我们项目考虑做跨平台开发，但是最后只定了H5版本。

现在是碰到了一个坑，大家在选型的时候，考虑一下是否能规避。

image.png

框架本身有一个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的页面，都加上以上的监听。

这简直是一项累死人的操作。。。