Nuxt JS 存储加载大量数据答案

【问题标题】：Nuxt JS store loading lots of dataNuxt JS 存储加载大量数据
【发布时间】：2020-03-30 14:42:25
【问题描述】：

我需要在一个页面上显示很多项目，1,000 + JSON 对象，但是，我最初不需要它们全部在页面上，只说 50 个左右，然后随着用户滚动显示更多。数据被加载并存储在存储中，并在页面上获取。如果我使用slice，这似乎可以解决问题，但我如何才能在滚动时显示更多内容？

<template>
  <div>
    <div v-for="(item, index) in items">
      {{ item }}
    </div>
  </div>
</template>

<script>
export default {
  computed: {
    getItems: {
      get() {
        return this.$store.state.items
      }
    }
  }
}
</script>

【问题讨论】：

标签： c javascript vue.js vuex nuxt.js

【解决方案1】：

您可以使用虚拟滚动条，如下所示： https://github.com/Akryum/vue-virtual-scroller

基本上它会像一个无限滚动器一样，只加载你想要的元素数量。

【讨论】：