Question

它没有重定向到页面。我在这里做错了什么？

此方法从表单获取所有数据，并将动态值添加到日期和令牌。

methods:{
        addToApi() {
            console.log(this.data);
            crypto.randomBytes(20,(err,buff)=>{
                let token = buff.toString('hex');
                let sub = this.data.sub;
                let date = Date.now() + 3600000;
                let newData = {
                    sub: this.data.sub,
                    token: token,
                    date: date
                }
                axios.post("http://localhost:3000/api/qrData",newData)
                    .then((res)=>{
//after sending the data to back end it should redirect to this route but it doesn't redirect
                   router.go('/');
            })
            .catch((err)=>{
                console.log(err);
            })
        })
    }
}
}

Answer 1

检查Vue Router: Programing Navigation，

正如教程所说：

<强> router.go（n）的

此方法将一个整数作为参数表示在历史堆栈中前进或后退多少步骤，类似于 window.history.go（n）。

对于您的用例，您应该使用router.push

Answer 2

~~主要问题是你引用的this变量在这种情况下与范围有不同的值。常见的解决方案是在this方法的第一行中创建一个存储addToApi()的新变量。~~

到目前为止，变量router在方法范围内未定义。您应该使用引用全局路由器对象的this.$router。当this变量在then函数（范围更改）中失去其值时，您希望使用我定义的vm变量。所以你的代码应该如下所示：

正如评论中所指出的，箭头函数不带this个变量。

如果要重定向到特定路线，则应使用$router.push方法。（go method was used in Vue Router's older versions and renamed to push in 2.x）

methods: {
  addToApi() {        
    crypto.randomBytes(20, (err, buff) => {
      let token = buff.toString('hex');
      let sub = this.data.sub;
      let date = Date.now() + 3600000;
      let newData = {
        sub: this.data.sub,
        token: token,
        date: date
      }
      axios.post("http://localhost:3000/api/qrData", newData)
        .then((res) => {
          //after sending the data to back end it should redirect to this route but it doesn't redirect
          this.$router.push('/');
        })
        .catch((err) => {
          console.log(err);
        })
    })
  }
}
}

Vue重定向。我的代码是重定向到我想要的页面

2 个答案: