Vue中的async和await的使用

async和await

在Vue中如果某個方法的返回值是Promise對象那么我們可以使用async和await來簡化這次Promise操作

• 注：await只能用在被async修飾的方法中
• 沒有使用async和await

login(){
    this.$refs.loginFormRef.validate(  valid =>{
        console.log(valid);
        if (!valid) return;
        const result=  this.$axios.post("login/loginCheckOut",this.loginForm);
        console.log(result);
    });
}

• 使用了async和await

login(){
    this.$refs.loginFormRef.validate( async valid =>{
        console.log(valid);
        if (!valid) return;
        const result= await this.$axios.post("login/loginCheckOut",this.loginForm);
        console.log(result);
    });
}

• 接着還可以使用{data:res}來解構出data數據

login(){
    this.$refs.loginFormRef.validate( async valid =>{
        console.log(valid);
        if (!valid) return;
        const {data:res}= await this.$axios.post("login/loginCheckOut",this.loginForm);
        console.log(res);
    });
}

來自為知筆記(Wiz)