看不到Nuxt / Axios进度栏

Question

Nuxt / Axios integration documentation很少，至少可以说是，但这似乎表明Nuxt进度条已自动与Axios集成在一起。但是我没看到。有时我会看到从页面到页面的进度条弹出，但在Axios提取期间却没有。

我的应用是SPA。

我做错什么了吗？我该怎么做才能使其显示？

我在nuxt.config.js中的Axios配置几乎没有任何内容（只需设置baseURL和超时），在我的页面中，我只是在简单地将原始内容提取到服务器：

mounted() {
  this.$axios.get("/users/" + auth.getUser().user_id).then(
    response => {
      this.user = response.data;
    },
    error => {
      util.showAxiosError("Failed to fetch user", error);
    }
  );
}

更新：

如果我在调用this。$ axios.get（）之前手动添加“ this。$ nuxt。$ loading.start（）”，则在Axios访存期间进度条仍然不会出现。在页面过渡期间仅短暂出现。如果我这样说：

loading: {
  color: "blue",
  height: "5px"
},

根据文档，然后短暂出现的进度条确实具有这种样式。

另一个更新：

如果我在没有axios的情况下单独尝试this.$nuxt.$loading.start();，则它[[确实有效。因此，axios以某种方式将其关闭。

Answer 1

您是否将加载代码放在mounted()生命周期挂钩中？然后它只会出现一次。

另一件事是，如果您不知道：

[不幸的是，加载组件无法预先知道加载新页面需要多长时间。因此，无法准确地将进度条动画化为加载时间的100％。

加载栏只是样式，仅此而已。您需要自己告诉需要多长时间]

this.$nuxt.$loading.start()

和
 this.$nuxt.$loading.end()