vue-tiny-virtual-list 虚拟列表 虚拟滚动列表

EN | 中文

👉 Advantages

Documentation

To check out docs, visit vue-tiny-virtual-list

Quick Start

npm install vue-tiny-virtual-list -S

<template>
  <div style="width: 500px; height: 400px">
    <VirtualList itemKey="id" :list="list" :minSize="20">
      <template #default="{ itemData, index }">
        <div>{{ index }} - {{ itemData.id }} - {{ itemData.text }}</div>
      </template>
    </VirtualList>
  </div>
</template>

<script>
  import { VirtualList } from 'vue-tiny-virtual-list';
  export default {
    components: { VirtualList },
    data() {
      return {
        list: [{ id: 0, text: 'text' }],
      };
    },
  };
</script>