开始使用

安装

npm

  $ npm install @virt-list/vanilla

pnpm

  $ pnpm install @virt-list/vanilla

yarn

  $ yarn add @virt-list/vanilla

注意!!!

1. list.item.id
2. item元素之间不能使用

引入

<div id="list" style="width: 500px; height: 400px"></div>

<script type="module">
  import { VirtList } from '@virt-list/vanilla';

  const list = Array.from({ length: 1000 }, (_, i) => ({
    id: i,
    text: `item-${i}`,
  }));

  const virtList = new VirtList({
    list,
    itemKey: 'id',
    itemPreSize: 20,
    container: document.getElementById('list'),
    renderItem: (itemData, index) => {
      const div = document.createElement('div');
      div.textContent = `${index} - ${itemData.id} - ${itemData.text}`;
      return div;
    },
  });
</script>