mirrors/vue-select
2
0
Fork 0
mirror of https://github.com/tenrok/vue-select.git synced 2026-06-13 08:32:26 +03:00
Code Activity

feat: header, footer, list-header, list-footer slots (#1085)

Browse Source
This commit is contained in:
Jeff Sagal
2020-03-09 21:56:37 -07:00
committed by GitHub
parent 3c546346f7
commit b2f388bc89
6 changed files with 193 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files
docs/guide/pagination.md
+18
View File
@@ -0,0 +1,18 @@
::: tip <Badge text="3.8.0+" />
Pagination is supported using slots available with Vue Select 3.8 and above.
:::
Pagination can be a super helpful tool when working with large sets of data. If you have 1,000
options, the component is going to render 1,000 DOM nodes. That's a lot of nodes to insert/remove,
and chances are your user is only interested in a few of them anyways.
To implement pagination with Vue Select, you can take advantage of the `list-footer` slot. It
appears below all other options in the drop down list.
To make pagination work properly with filtering, you'll have to handle it yourself in the parent.
You can use the `filterable` boolean to turn off Vue Select's filtering, and then hook into the
`search` event to use the current search query in the parent component.
<Paginated />
<<< @/.vuepress/components/Paginated.vue