Nuxt Loader - 自定义加载程序的节流阀

Question

我正在为我的项目使用自定义加载器组件，我的 nuxt 配置如下所示：

loading: '~/components/common/loading.vue'

问题是这个组件不会限制几毫秒，并且随着每次页面更改，它会闪烁并导致糟糕的用户体验。有什么方法可以像我们通常在throttle: 200 对象中添加默认组件一样添加节流阀，例如loading，

loading: { throttle: 200 }

由于我的加载选项没有对象，而是有一个指向我的自定义加载组件的字符串/路径，所以我不确定在这里做什么。

参考：https://nuxtjs.org/docs/2.x/features/loading

Answer 1

您可以在自定义加载程序组件~/components/common/loading.vue 的start() 方法中添加一个setTimeout。

methods: {
   start() {      
     setTimeout(() => {
        this.loading = true;
     }, 2000);           
   },
   finish() { ... }
}