uniapp中，使用async和await，得到的结果是undefind

Question

哪位大锅帮忙看一下呗
封装的请求：

export const request = (option) => {
        option.url = 'http://localhost:3000/api' + option.url
        option.method = option.method || "Get"  
        option.data =  option.data || {}
        option.header = option.header || {"content-type":"application/json"}
        option.dataType = option.dataType || "json"
        return new Promise((res,rej) => {
            uni.showLoading({
                title: '数据加载中'
            })
            uni.request({
                ...option,
                success:(val) => {
                    if(val.code != 200) {
                        return rej()
                    }
                    const data = val
                    res(data)
                }
            })
            uni.hideLoading()
        })
}

发请求的事件：

methods: {
            async login (){
                try {
                    let form = this.form
                    let newForm = Object.assign({},form)
                    console.log('newForm',newForm);
                    let get = await request({url:`/login/get/accnum/${newForm.username}/${newForm.userpwd}`,method:'get'})
                    console.log('get',get);
                    // let post = await request({url:'/login/post/accnum',method:'post',data:newForm})
                    // console.log('post---------',post);
                } catch(err) {
                    console.log(err);
                }
            }
        },

我用postman试过这个请求是没问题的，但是不知道为什么我使用async await成这样了

Answer 1

【以下回答由 GPT 生成】

问题的原因是在封装的request函数中使用了同步的uni.showLoading和uni.hideLoading方法，这会导致异步请求还没有完成就立即隐藏loading动画。

解决方法可以将uni.showLoading和uni.hideLoading方法放在异步请求的uni.request的success回调函数中，确保在请求成功后再隐藏loading动画。以下是修改后的代码：

export const request = (option) => {
    option.url = 'http://localhost:3000/api' + option.url
    option.method = option.method || "Get"
    option.data = option.data || {}
    option.header = option.header || {"content-type":"application/json"}
    option.dataType = option.dataType || "json"
    return new Promise((res,rej) => {
        uni.request({
            ...option,
            success: (val) => {
                uni.hideLoading()
                if(val.code !== 200) {
                    return rej()
                }
                const data = val
                res(data)
            }
        })
        uni.showLoading({
            title: '数据加载中'
        })
    })
}

methods: {
    async login (){
        try {
            let form = this.form
            let newForm = Object.assign({},form)
            console.log('newForm',newForm);
            let get = await request({url:`/login/get/accnum/${newForm.username}/${newForm.userpwd}`,method:'get'})
            console.log('get',get);
            // let post = await request({url:'/login/post/accnum',method:'post',data:newForm})
            // console.log('post---------',post);
        } catch(err) {
            console.log(err);
        }
    }
},

通过将uni.showLoading和uni.hideLoading移动到正确的位置，确保在请求成功后再隐藏loading动画，可以解决返回结果为undefined的问题。

【相关推荐】

• 请看👉 ：async await 是什么？它有哪些作用？
• 除此之外, 这篇博客: async和await、宏任务和微任务中的 Ⅱ - 贰 - 宏任务和微任务 部分也许能够解决你的问题。

如果你已经解决了该问题, 非常希望你能够分享一下解决方案, 写成博客, 将相关链接放在评论区, 以帮助更多的人 ^-^