Niklas/shadcn-vue
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

docs: fix show selected rows step

Browse Source
This commit is contained in:
Shl 2024-07-05 20:55:14 +07:00
parent d50ea38f4a
commit 548aa7ed4d
1 changed files with 19 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

24
apps/www/src/content/docs/components/data-table.md
View File

@ -866,11 +866,25 @@ This adds a checkbox to each row and a checkbox in the header to select all rows
You can show the number of selected rows using the `table.getFilteredSelectedRowModel()` API.
```vue
<div class="flex-1 text-sm text-muted-foreground">
{{ table.getFilteredSelectedRowModel().rows.length }} of
{{ table.getFilteredRowModel().rows.length }} row(s) selected.
</div>
```vue:line-numbers {8-11}
<template>
<div>
<div class="border rounded-md">
<Table />
</div>
<div class="flex items-center justify-end space-x-2 py-4">
<div class="flex-1 text-sm text-muted-foreground">
{{ table.getFilteredSelectedRowModel().rows.length }} of
{{ table.getFilteredRowModel().rows.length }} row(s) selected.
</div>
<div class="space-x-2">
<PaginationButtons />
</div>
</div>
</div>
</template>
```
</Steps>