APP中登录时候需要请求接口的逻辑，查看订购权限或登录后校验套餐等之类

程序媛_MISS_zhang_0110

已于 2024-01-05 10:17:46 修改

阅读量37

点赞数

分类专栏： APP项目文章标签： javascript vue android ios

于 2021-06-17 17:51:24 首次发布

本文链接：https://blog.csdn.net/MISS_zhang_0110/article/details/117995183

版权

本文探讨了在Vue应用中，如何在APP启动时通过调用接口获取用户信息，并进行登录状态和订购权限的检查。在app.main.js中，使用Vue的nextTick确保DOM更新后再执行相关操作。在store的index.js中，详细阐述了状态管理的过程，包括组件的生命周期和数据更新顺序。整个流程涉及到微任务的执行，确保在正确的时间点隐藏头部并执行权限校验。

摘要由CSDN通过智能技术生成

1.app.mian.js

router.beforeEach((to, from, next) => {
   
    new Promise(resolve => {
   
        if (store.state.firstComing) {
    // vuex 中 store的firstComing是true
            console.log('first')
            new Promise(resolve => {
   
                store.dispatch('getMyInfo', resolve) //获取个人信息
            }).then(() => {
   
                store.dispatch('setOrderFlag', resolve) //订购权限接口
                store.dispatch('setLoginVerifyFlag', resolve) //校验套餐接口
            })
            //resolve()
        } else {
   
            console.log('second')
            resolve()
        }
    }).then(() => {
   
        let arr = [
            '/enterpriseList',
            '/newCompanyList',
            '/patentList',
            '/bidList',
            '/searchCompanyList',
            '/searchBidList',
            '/searchPatentList',
            '/companyDetails',
            '/patentDetails',
            '/bidDetails',
            '/successBidDetails',
        ]
        if (arr.some(el => el === to.path)) {
    //如果路由是arr中的就隐藏APP的头，不是就不要隐藏
            //隐藏头部
            console.log('隐藏头部')
            try {
   
                /* eslint-disable */
                if (UmsApp.isUmsApp) {
   
                    console.log('---store----')
                    console.log('开始隐藏头部')
                    Vue.nextTick(() => {
    //enterpriseList页面进入，执行created生命周期，
                    //当这个页面的dom发生变化时候，就开始隐藏APP头部
                        var params = {
   
                            style: {
   
                                header