虚拟化选择器 SelectV2
大数据选择沿用 Arco Select 的外观,列表使用 Element Plus 的虚拟滚动。 属性用法见 Element Plus 文档。
大量选项
生成 1000 个选项,通过虚拟滚动减少同时渲染的节点。
与 Arco 的差异
- 每项默认高度为 34px;传
:item-height="36"可与 Arco 一致。 - 展开时键盘高亮定位到已选项,保留 Element Plus 行为。
大数据选择沿用 Arco Select 的外观,列表使用 Element Plus 的虚拟滚动。 属性用法见 Element Plus 文档。
生成 1000 个选项,通过虚拟滚动减少同时渲染的节点。
<script setup lang="ts">
import { ref } from 'vue'
const value = ref('')
const options = Array.from({ length: 1000 }, (_, index) => ({ value: index, label: `Option ${index + 1}` }))
</script>
<template>
<el-select-v2 v-model="value" :options="options" :item-height="36" :show-arrow="false" filterable placeholder="Select an option" style="width: 280px" />
</template>:item-height="36" 可与 Arco 一致。