GITHUB SNAPSHOT

tangbc/vue-virtual-scroll-list

TopGit repo profile for tangbc/vue-virtual-scroll-list, with GitHub repository stats and README context.

Stars

★ 4.5k

Forks

⑂ 594

Language

JavaScript

Topic

Data

License

MIT

Updated

2.3y ago

Contributors

👥 36

Homepage

View ↗

View on GitHub ↗

QUICK VERDICT

Snapshot of tangbc/vue-virtual-scroll-list: 4.5k★, JavaScript, Data. ⚡️A vue component support big amount data list with high render performance and efficient.

Snapshot summary built from the project's own GitHub metadata — there's no written TopGit review yet. The page will update automatically when a full review is published.

WHY NO REVIEW YET

TopGit writes full reviews for the most-starred, most-requested repositories. This page is a snapshot until then — see the READ ME tab for the original README in full.

Snapshot

Stars★ 4.5k

Forks⑂ 594

LanguageJavaScript

TopicData

LicenseMIT

Homepage

View ↗

Read our review methodology ↗

Top contributors

Show top contributors

Top 21 contributors to tangbc/vue-virtual-scroll-list

Prop	Type	Description
`data-key`	String\|Function	The unique key get from `data-sources` in each data object. Or a function called with each `data-source` and return their unique key. Its value must be unique in `data-sources`, it is used for identifying item size.
`data-sources`	Array[Object]	The source array built for list, each array data must be an object and has an unique key get or generate for `data-key` property.
`data-component`	Component	The render item component created / declared by vue, and it will use the data object in `data-sources` as render prop and named: `source`.

Prop	Type	Default	Description
`keeps`	Number	30	How many items you are expecting the virtual list to keep rendering in the real dom.
`extra-props`	Object	{}	Extra props assign to item component that are not in `data-sources`. Notice: `index` and `source` are both occupied inner.
`estimate-size`	Number	50	The estimate size of each item, if it is closer to the average size, the scrollbar length looks more accurately. It is recommended to assign the average that calculate by yourself.

Prop	Type	Default	Description
`start`	Number	0	Setting scroll position stay start index.
`offset`	Number	0	Setting scroll position stay offset.
`scroll`	Event		Emited when scrolling, param `(event, range)`.
`totop`	Event		Emited when scrolled to top or left, no param.
`tobottom`	Event		Emited when scrolled to bottom or right, no param.
`resized`	Event		Emited when item resized (mounted), param `(id, size)`.
`direction`	String	vertical	Scroll direction, available values are `vertical` and `horizontal`
`page-mode`	Boolean	false	Let virtual list using global document to scroll through the list.
`top-threshold`	Number	0	The threshold to emit `totop` event, attention to multiple calls.
`bottom-threshold`	Number	0	The threshold to emit `tobottom` event, attention to multiple calls.
`root-tag`	String	div	Root element tag name.
`wrap-tag`	String	div	List wrapper element `(role=group)` tag name.
`wrap-class`	String		List wrapper element class name.
`wrap-style`	Object	{}	List wrapper element inline style.
`item-tag`	String	div	Item wrapper element `(role=item)` tag name.
`item-class`	String		Item wrapper element class name.
`item-class-add`	Function		A function that you can return extra class (String) to item wrapper element, param `(index)`.
`item-style`	Object	{}	Item wrapper element inline style.
`item-scoped-slots`	Object	{}	The `$scopedSlots` for item component.
`header-tag`	String	div	For using header slot, header slot wrapper element `(role=header)` tag name.
`header-class`	String		For using header slot, header slot wrapper element class name.
`header-style`	Object	{}	For using header slot, header slot wrapper element inline style.
`footer-tag`	String	div	For using footer slot, footer slot wrapper element `(role=footer)` tag name.
`footer-class`	String		For using footer slot, footer slot wrapper element class name.
`footer-style`	Object	{}	For using using footer slot, footer slot wrapper element inline style.

Method	Description
`reset()`	Reset all state back to initial.
`scrollToBottom()`	Manual set scroll position to bottom.
`scrollToIndex(index)`	Manual set scroll position to a designated index.
`scrollToOffset(offset)`	Manual set scroll position to a designated offset.
`getSize(id)`	Get the designated item size by id (from `data-key` value).
`getSizes()`	Get the total number of stored (rendered) items.
`getOffset()`	Get current scroll offset.
`getClientSize()`	Get wrapper element client viewport size (width or height).
`getScrollSize()`	Get all scroll size (scrollHeight or scrollWidth).
`updatePageModeFront()`	When using page mode and virtual list root element offsetTop or offsetLeft change, you need call this method manually.

Related repositories

FREQUENTLY ASKED

Quick answers

How active is development on tangbc/vue-virtual-scroll-list?

The most recent commit recorded on tangbc/vue-virtual-scroll-list was 2.3 years ago, based on the GitHub push timestamp. The repository has 594 forks — one of the better signals of community interest.

How many stars does tangbc/vue-virtual-scroll-list have?

tangbc/vue-virtual-scroll-list has 4.5k GitHub stars — refresh the page for the live number, or check github.com/tangbc/vue-virtual-scroll-list. TopGit mirrors GitHub's count but does not claim minute-by-minute accuracy.

Is tangbc/vue-virtual-scroll-list open source?

Yes — tangbc/vue-virtual-scroll-list ships under the MIT license, which makes its source code freely readable (and, depending on license terms, forkable and reusable). Source: github.com/tangbc/vue-virtual-scroll-list.

What else is in the Data space?

tangbc/vue-virtual-scroll-list is tracked by TopGit under the Data category, alongside 3 GitHub-tagged topics. Trending and Topics pages list peer repositories of comparable stars and language.

What is tangbc/vue-virtual-scroll-list?

tangbc/vue-virtual-scroll-list (tangbc/vue-virtual-scroll-list) is a JavaScript project on GitHub. From the project's own README: ⚡️A vue component support big amount data list with high render performance and efficient.

What language is tangbc/vue-virtual-scroll-list written in?

tangbc/vue-virtual-scroll-list is written primarily in JavaScript. GitHub's language field is based on the largest share of bytes in the default branch.

What license does tangbc/vue-virtual-scroll-list use?

tangbc/vue-virtual-scroll-list is released under the MIT license. Always verify the LICENSE file directly on GitHub for the authoritative terms — license strings can be edited out of sync with a project's actual stance.

Where do I read more about tangbc/vue-virtual-scroll-list?

This TopGit page is a snapshot — the READ ME tab shows the project's own README content (links stripped, images preserved). The GitHub repository at github.com/tangbc/vue-virtual-scroll-list is the definitive source.

Read full README in the tab above.

Curious whether vue-virtual-scroll-list is right for you?

Let ChatGPT, Claude, or Perplexity look into it — click below and see what AI actually says about vue-virtual-scroll-list.

Ask ChatGPT Ask Claude Ask Perplexity

GitHub

tangbc/vue-virtual-scroll-list

Snapshot

Top contributors

Table of contents

Advantages

Live demo

Simple usage

Props type

Required props

Optional props

Public methods

Attentions

Contributions

Changelogs

License

Related repositories

Quick answers

Curious whether vue-virtual-scroll-list is right for you?