Virtual List
Basic usage
1Virtual row 1
2Virtual row 2
3Virtual row 3
4Virtual row 4
5Virtual row 5
<script setup lang="ts">
import { NmorphVirtualList } from "@nmorph/nmorph-ui-kit";
const items = Array.from({ length: 1000 }, (_, index) => `Virtual row ${index + 1}`);
</script><template>
<NmorphVirtualList
class="virtual-list-basic-usage-overview"
:items="items"
:item-height="44"
height="260px"
>
<template #default="{ item, index }">
<div class="virtual-list-basic-usage-overview__item">
<strong>{{ index + 1 }}</strong>
<span>{{ item }}</span>
</div>
</template>