Vue.js 组件无法在慢速互联网上渲染

Question

所以我有一个组件，需要显示在书的最后一页上，有时它不显示，几秒钟，有时你需要在上一页上列出并在最后一页上列出它待展示。另外，当我尝试限制（网速慢）时，它不会立即显示

我不知道如何解决这个问题

Answer 1

在处理重要维度的组件时，最佳实践是尝试并实现延迟加载技术，或者正如 Estus Flask 指出的使用 AsyncComponents。

使用以下代码部分可以让您尽快加载组件，因此渲染时间不会直接受到互联网连接的影响。

import { defineAsyncComponent } from 'vue'

const AsyncComp = defineAsyncComponent(() =>
  import('./components/MyComponent.vue')
)

当然，仍然可能会发生互联网连接太差而导致用户加载时间过长的情况。 更多信息请访问 https://vuejs.org/guide/components/async。

为了改善用户体验，ui/ux 最佳实践建议还使用旋转器或骨架（https://learnvue.co/articles/vue-sculpture-loading），正如 Kissu 在评论中指出的那样。