在vue-cli脚手架中创建一个AxiosMethod.js文件用来放公共方法。
开始的代码如下:
export function post() { await axios.post("http://localhost:9090/checkFace").then(function (res) { if (res.data.code == 1) { ElMessageBox.alert('识别成功', '系统提示', { confirmButtonText: 'OK' }) this.$router.push("/"); } else { ElMessageBox.alert('识别失败', '系统提示', { confirmButtonText: 'OK' }) } }).catch(function (err) { console.log(err) }); }
当开始测试的时候出现了 警告: Promise returned from xxx is ignored,执行成功但是无法跳转页面。
需要把方法加上async和await。 警告: Promise returned from xxx is ignored 就没有了。
export async function post() { await axios.post("http://localhost:9090/checkFace").then(function (res) { if (res.data.code == 1) { ElMessageBox.alert('识别成功', '系统提示', { confirmButtonText: 'OK' }) this.$router.push("/"); } else { ElMessageBox.alert('识别失败', '系统提示', { confirmButtonText: 'OK' }) } }).catch(function (err) { console.log(err) }); }
但是出现了新的问题,浏览器警告:无法识别$router
然后我想了想,这虽然是在vue脚手架中,但是是js文件,this指向的应该不是vue对象,在js文件中this指向应该是window。而window中是没有$router的,所以警告无法识别$router。
解决:
在js文件中引入router。
import router from "@/router";
export async function post() { await axios.post("http://localhost:9090/checkFace").then(function (res) { if (res.data.code == 1) { ElMessageBox.alert('识别成功', '系统提示', { confirmButtonText: 'OK' }) router.push("/"); } else { ElMessageBox.alert('识别失败', '系统提示', { confirmButtonText: 'OK' }) } }).catch(function (err) { console.log(err) }); }
OK 。 搞定。