# InfiniteScroll
The InfiniteScroll
component expects you to do tell it two things at a minimum:
- What to render:: You do this by setting the
items
-prop. The items should be an array of objects with anid
-field. - How to render a single item: You do this by providing the scoped default slot. By default,
InfiniteScroll
expects the items-array to contain objects that have a least anid
-property. You can override this by setting thekeyField
-prop.
Slot Props
The default slot you have to provide receives several slot-props:
item
: The item that should be renderedindex
: The index (type:Number
) of the itemactive
: Aboolean
value that istrue
the item is currently active. An item is considered active when it is currently beeing positioned by the virtualization library (opens new window) that is used under the hood.
# Props
# keyField
Type: String
Default: id
Name of property that uniquely identifies an item.
# minItemSize
Type: Number
Default: 18
Minimal size of the items (in px
). Will be passed onto DynamicScroller.
# items
Type: Array
Default: []
Items to be rendered by the infinite scroll component. Each item must have a unique identifier. You can specify the name of the identifying property by using the key-field-prop.
# loadMore
Type: Function
Default: not specified
Function to be called when the list needs more items from you. This function is called with a callback parameter that you MUST call at some point with additional items.
# Slots
# before scoped
# default scoped
# after scoped
# Events
# scrollPosition
Arguments:
none
# Methods
# scrollToIndex
Scrolls the list to the item at index
.
Arguments:
- index The row index of the item you want to scroll to.