VUE中解决长列表方法，VUE中使用VUE-VIRTUAL-SCROLL-LIST 详情，VUE可视区渲染

1. 安装 vue-virtual-scroll-list

    npm install vue-virtual-scroll-list --save

2.  引入下载好的组件    记得局部注册一下组件

import virtualList from 'vue-virtual-scroll-list'

3. v-for循环的方式  循环数据     

<template>
  <div class="about">
    <h1>This is an about page</h1>
    <div>
      <virtual-list :size="40" :remain="8">
        <div v-for="item of items" :key="item.id">{{ item }}</div>
      </virtual-list>
    </div>
  </div>
</template>

<script>
import virtualList from 'vue-virtual-scroll-list'
export default {
  data() {
    return {
      items: []
    }
  },
  methods: {
    forss() {
      for (let i = 1; i <= 1000000; i++) {
        this.items.push({
          id: i,
          name:
            i +
            '12123d5a45ad56addadjak放假啊就恢复健康发号放假安徽科技发货方就按客户'
        })
      }
    }
  },
  created() {
    this.forss()
  },
  components: { 'virtual-list': virtualList }
}
</script>