fix: add template code in guide docs
This commit is contained in:
parent
79a344626e
commit
d86c7159df
|
|
@ -16,6 +16,10 @@ Next step is to create a `useVirtualList` instance and pass our `tableRows` to i
|
|||
|
||||
<<< @/examples/big-data/components/DataTable.vue#useVirtualList{2-3 ts}
|
||||
|
||||
As you see `useVirtualList` function returns `list` object which contains `list` property with only visible items and `containerProps`, `wrapperProps` which should be passed to the container and wrapper element.
|
||||
|
||||
<<< @/examples/big-data/components/DataTable.vue#template{4,5,14-24 vue:line-numbers}
|
||||
|
||||
## Example
|
||||
|
||||
Here is an example of how to use `useVirtualList` to render a large amount of data. For test purposes, we will use 2000 rows for our table, you can change statuses, priorities, and view to see speed difference.
|
||||
|
|
|
|||
|
|
@ -82,6 +82,7 @@ const { list, containerProps, wrapperProps } = useVirtualList(tableRows, {
|
|||
// #endregion useVirtualList
|
||||
</script>
|
||||
|
||||
<!-- #region template -->
|
||||
<template>
|
||||
<div class="space-y-4">
|
||||
<DataTableToolbar :table="table" />
|
||||
|
|
@ -122,3 +123,4 @@ const { list, containerProps, wrapperProps } = useVirtualList(tableRows, {
|
|||
<DataTablePagination :table="table" />
|
||||
</div>
|
||||
</template>
|
||||
<!-- #endregion template -->
|
||||
|
|
|
|||
Loading…
Reference in New Issue
Block a user