如何优化 v-for 渲染（渲染 1000 个用户）答案

【问题标题】：How to optimize the v-for rendering (render 1000 users)如何优化 v-for 渲染（渲染 1000 个用户）
【发布时间】：2018-09-10 00:37:40
【问题描述】：

我正在渲染 +1000 个用户的列表，有没有办法例如显示前 20 个用户，然后显示第二个 20 直到最后？因为一次渲染所有用户需要一些时间

或呈现前 20 个用户，然后显示其余用户我可以例如 v-for users.splice(0,20)，然后 v-for 其余 users.splice(21) 有什么简单的方法吗

【问题讨论】：

【解决方案1】：

您可以通过添加一个包含用户当前所在页面的信息的页面变量并添加一个计算属性来返回用户来尝试做的事情。

computed: {
   filteredUsers() {
      return this.users.slice(20 * this.page, 20 * (this.page + 1));
   }
}

然后，如果您在此数组上使用 v-for，您将获得所需的功能。要获得以下 20 个用户，您只需将页面增加一即可。

【讨论】：