为何没有跳出去？还是继续执行下面的操作

Question

一个VUE的页面，定义了一个函数。鼠标点击时候执行这个函数

methods: {
function onclicka(){
    const that = this
    const token = localStorage.getItem('token')
    .....
                if(!token){
                    that.$dialog.alert({
                        message: '对不起，你还没有登录！',
                    });
                    return;
                }else{
                    axios.get('/api/user/getuserinfo', {
                        params: {
                            token: token,
                        }
                    }).then(function(res) {
                        if (res.data.code == 1) {
                            if(res.data.data.group_id == 2){
                                console.log('2');
                                that.$dialog.alert({
                                    message: '对不起，用户类型不合法！',
                                });
                                return;
                            }
                        }
                    })
                }
....

如果用户没有登录时（即TOKEN为空的时候），运行正常可以弹出“对不起，你还没有登录！”，并停止执行该函数下面操作。但是在用户类型不合法的时候。并没有跳出，而是继续执行该函数下面的操作。可以打印出console.log 2,但是没有按照我的计划return跳出停止执行。求解

Answer 1

当然是你条件有问题了。你这 token 是怎么赋值的。

目前的结果符合你的要求嘛？

Answer 2

这样不行吗？

if(!token){

}else{

}

你的if条件连 undefined 都过滤不了。

Answer 3

getUserInfo() {
  return new Promise(resolve => {
    axios().then(res =>{resolve(res)}) 
  })
}
async onclicka(){
    if(!token){
    }else{
        let res = await this.getUserInfo();
        if(res.data.data.group_id == 2) return
    }
}

Answer 4

从你的描述来看，问题可能不出在onclicka这个函数内，而是其他地方，我很怀疑你的token是在哪里进行localStorage.setItem的

你最好在 const token = localStorage.getItem('token') 下面打个 debugger，这样问题就一清二楚了。

Answer 5

你所说的 而是继续执行该函数下面的操作。 执行的是那一部分代码
如果是如下结构

if(!token){
  ...
}else{
  ...
}
// 猜测你的代码结构
console.log('不想的执行代码，但却执行了')

这是因为你的接口请求是异步的，这里的代码必然会执行