Vuecli 带参数跳转页面

---

Vuecli 带参数跳转页面

1.带参数跳转

这是一个普通的登录界面js函数，用这个函数请求后端获取登录权限

login(){
      if (this.value=="student"){

        this.$ajax.post(base_url + "student/login",{
          username : this.username,
          password : this.password
        }).then(response => {

              if(response.data.code == 200){
                this.$router.push({
                  path:'/student_repair/student', query:{
                    username:this.username
                  }
                })
              }else {
                console.log("出错了")
              }
            }
        )

效果展示

登录页面展示

2目标界面接收参数

这里用到了生命周期钩子

  created() {
    this.username = this.$route.query.username;
  },

成果演示