vue中axios的封装问题

Question

这是我fresh里面的代码

export function fetch(options) {
    return new Promise((resolve, reject) => {
        const instance = axios.create({
            //所有的请求都会带上这些配置，比如全局都要用的身份信息等。
            headers: {
                'Content-Type': 'application/json',
            },
            timeout: 30 * 1000 // 30秒超时
        });
        instance(options)
            .then(response => {
                Message({
                    message: '恭喜你，这是一条成功消息',
                    type: 'success'
                });
                resolve(response);
            })
            .catch(error => {
                reject(error);
            });
    });
}

这是我index里面的代码

export function test(params) {
    return fetch({
        url: api.test,
        method: 'get',
        params
    })
}

现在我在页面使用的时候只能通过.then()方法来获取到test里面的返回值。有没有办法在页面的时候通过

const res=test();
而不是
test().then(res=>{
    if(res){
    ....
    }
})

Answer 1

async submit() {
   var result= await api.test()
}

Answer 2

首先楼主要明白，你的 fetch 返回的是一个 promise 对象，所以你的 test 方法返回的也是一个 promise 对象。它不是接口返回的数据。因此处理 promise的方法，有两种，一种是 .then()，一种就是 async...await。后一种写法更符合开发人员的同步思维。