【问题标题】:vue-router push route after axios post requestaxios发布请求后vue-router推送路由
【发布时间】:2020-11-30 07:55:03
【问题描述】:

当我写下以下代码时:

axios.post('/user', { email: this.email })
.then(
    (response) => {
      if (!response.data) {
        this.$router.push({ path: '/register', params: { user: defaultUser } });
      } else {
        this.$router.push({ path: '/login', params: { user: response.data } });
      }
    }, 
    (error) => {
      console.log(error);
    }
);

编译器显示错误@typescript-eslint/no-floating-promises: Promises must be handled appropriately or explicitly marked as ignored with the void operator.

我也尝试在 then 块之后放置一个 catch 块,但仍然是同样的问题。

axios.post('/user', { email: this.email })
  .then((response) => {
    if (!response.data) {
      this.$router.push({ path: '/register', params: { user: defaultUser } });
    } else {
      this.$router.push({ path: '/login', params: { user: response.data } });
    }
  })
  .catch((error) => {
    console.log(error);
  });

我还发现当我注释掉this.$router.push 时问题就消失了。所以问题可能涉及重定向路由和解决承诺。也许最好将问题改写为“如何在不留下未解决的承诺的情况下重定向路由”?我希望我把问题说清楚。

【问题讨论】:

  • @JonathanAkweteyOkine 我已经检查了帖子,但我认为它没有解决我的问题。我已经更新了这个问题,希望能说清楚。
  • 你的 sn-p 底部的大括号是否来自外部函数?
  • @Daniel_Knights 是的,这是来自外部函数。我进行了更改,然后将其删除。

标签: javascript vue.js axios vue-router typescript-eslint


【解决方案1】:

好吧,我终于想通了。 this.$router.push() 返回一个我处理不好的承诺。最终解决方案如下:

axios.post('/user', { email: this.email })
  .then((response) => {
    if (!response.data) {
      void this.$router.push({ path: '/register', params: { user: defaultUser } });
    } else {
      void this.$router.push({ path: '/login', params: { user: response.data } });
    }
  })
  .catch((error) => {
    console.log(error);
  });

由于void 会触发eslint no-void 语法错误,而且我不关心这个promise 的返回值,我通过添加/* eslint-disable no-void */ 来抑制警告。

【讨论】:

    猜你喜欢
    • 2018-12-28
    • 2014-06-16
    • 2018-10-06
    • 2019-01-29
    • 1970-01-01
    • 2020-05-12
    • 2017-10-02
    • 2019-04-26
    • 2019-10-29
    相关资源
    最近更新 更多