调用具体路径 axios.post(具体路径,{
username:this.ruleForm.username,
password:this.ruleForm.password
})
.then(res=>{
console.log(res);
let {data,meta}=res.data;
if(meta.status==200){
this.$message.success(meta.msg);
/* 当登录成功,把用户名和token存入本地缓存中 */
localStorage.username=data.name;
localStorage.token=data.token;
setTimeout(()=>{
this.$router.push({name:'index'})
},100)
}else{
this.$message.warning(meta.msg)
}
})
.catch(err=>{
console.log(err);
})
} else {
this.$message.error('输入的有误')
}
});
},
登录成功跳转后,由于使用的接口展示的数据是有两个数组的,所以采用双重for循环的方式
el-submenu是使用的element当中的样式
<el-submenu :index="(i+1).toString()" v-for="(v,i) in navList" :key="i">
<template slot="title"><i class="el-icon-menu"></i>{{v.authName}}</template>
<el-menu-item :index="`/index/`+item.path" v-for="(item,index) in v.children" :key="index">{{item.authName}}</el-menu-item>
</el-submenu>