1.产生原因代码

const login = async () => {
	state.loading.signIn = true;
	//验证账号密码是否存在
	await loginSumit(state.ruleForm).then(res => {
		if (!res.state) {
			wmpWarn(res.message);
			state.loading.signIn = false;
			return false;
		} else {
			// 存储 token 到浏览器缓存
			Session.set('token', res.data);
		}
	});
	console.log("+++")
}

代码走完 return false之后,又向下执行console.log("+++")

由于是vue新手,个人分析与async、await有关系,也可能与Promise有关系。

解决办法:

定义一个boolean变量,在函数外捕捉变量值,如果为false,则推出。这种方法生效

上代码:

	   const loginflag = ref(false);
		const login = async () => {
			state.loading.signIn = true;
			//验证账号密码是否存在
			await loginSumit(state.ruleForm).then(res => {
				if (!res.state) {
					wmpWarn(res.message);
					loginflag.value = res.state;
					state.loading.signIn = false;
				} else {
					// 存储 token 到浏览器缓存
					Session.set('token', res.data);
				}
			});

          // 此处就会阻止代码继续向下执行
			if (!loginflag.value) {
				return false;
			}
           ...............
     }

以上是我遇到的问题,也是我个人的解决方案。如果有其他小伙伴知道什么原因造成的或者有更好解决方案,请评论区上详解

Logo

前往低代码交流专区

更多推荐