【工作实践-01】实验室APP端—异步

一、遇到问题：异步

问题：(1) app端刚安装(即本地存储信息为空，用户信息也为空)；(2) 登陆后在生命周期onShow中直接获取用户信息会存在获取信息为空的情况（用户信息使用VUEX管理）；

问题原因：异步（获取用户信息和菜单信息需要请求接口数据），异步问题导致onShow()中获取的菜单列表为空

问题解决：async ,await

onShow() {
            console.log(this.$store.state.User.menuInfo) // app端在刚安装的情况下（本地存储信息也为空），获取值为空
this.getMenuList()
this.nowDate = this.$dayjs().format('YYYY-MM-DD')
},
methods: {
            // 获取用户信息和菜单列表需要请求接口获取数据，此时就存在异步问题，用async、await来解决异步问题
async getMenuList() {
let selectedMenu = []
// app端刚安装时即本地存储中用户信息为空时，会存在获取不到用户信息的情况
                // 因此使用await在等待获取用户信息和菜单列表后再进行后续菜单过滤操作
Object.values(this.$store.state.User.user).length ? '' : await this.$store.dispatch('setUserInfoAction')
// 若用户没有选择则默认选择三个应用进行展示：目前是数据报表、评估管理和实验室预约三个菜单，若已选择，按用户选择展示
if (uni.getStorageSync('selectedMenu').length) {
selectedMenu = uni.getStorageSync('selectedMenu')
} else {
// await this.$store.dispatch('setUserInfoAction')
selectedMenu = ['chart', 'appraise', 'lab-reserve']
uni.setStorageSync('selectedMenu', selectedMenu)
}
this.selectedMenu = this.showMenu.filter(item => selectedMenu.includes(item.key)).concat(this.showFooterMenu
.filter(item => selectedMenu.includes(item.key)))
},
}

二、解决异步问题的方法

 1.Promise

         如以下代码，也是在该项目中遇到的，在VPN认证成功之后才能进行余下的登录操作，此时就需要把VPN认证做成一个异步函数。

function VPNSubmit(username, password) {
return new Promise((resolve, reject) => {
if (getAuthStatus() !== "SFAuthStatusAuthOk") {
uni.showLoading({
title: 'VPN正在认证，请稍候...'
})
VPNObj.startPasswordAuth({
h: 'https://a.sslvpn.hbjd.edu.cn',
u: username,
p: password
}, result => {
uni.hideLoading();
uni.showModal({
title: '提示',
content: result.result,
showCancel: false
});
if (JSON.parse(result.SFBaseMessage).mErrCode === 1000) {
resolve(true)
} else {
reject('error')
}
})
} else {
/**
 * 已认证
 */
uni.showToast({
title: 'VPN已认证！',
duration: 2000,
});
resolve(true)
}
})
}

 2. async await

        例子参考以上问题解决部分 

3. gengerator函数（不常用）

        鄙人才疏学浅，请参考最全前端异步解决方案【推荐收藏】 - 掘金 (juejin.cn) 

原文地址：https://blog.csdn.net/weixin_49491274/article/details/132245690

免责声明：本站文章内容转载自网络资源，如本站内容侵犯了原著者的合法权益，可联系本站删除。更多内容请关注自学内容网（zxcms.com）！