vue3使用vue-virtual-scroller

Vue Virtual Scroller 是一个 Vue.js 的虚拟滚动列表组件，它可以大大提高列表的性能和渲染速度。在 Vue 3 中，使用 Vue Virtual Scroller 的方法和在 Vue 2 中基本相同。

首先，你需要安装 `vue-virtual-scroller`：

npm install vue-virtual-scroller --save

然后在你的 Vue 组件中引入它：

import { VueVirtualScroller } from 'vue-virtual-scroller'
import 'vue-virtual-scroller/dist/vue-virtual-scroller.css'

export default {
  components: {
    VueVirtualScroller
  },
  // ...
}

在模板中使用 `vue-virtual-scroller`：

<template>
  <vue-virtual-scroller class="my-list" :items="items" item-height="50">
    <template v-slot="{ item }">
      <div class="my-item">{{ item }}</div>
    </template>
  </vue-virtual-scroller>
</template>

其中，`:items` 是一个数组，包含了要渲染的列表项，`item-height` 是每个列表项的高度，`v-slot` 是一个插槽，用于渲染每个列表项。你可以在插槽中使用 `item` 变量来访问每个列表项的数据。

以上就是在 Vue 3 中使用 `vue-virtual-scroller` 的基本方法。你可以根据自己的需求来调整列表项的高度和样式。同时，你也可以根据官方文档的说明来使用其他高级特性，如加载更多、缓存等。