axios调用接口

101 阅读1分钟

调用具体路径 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>