VirtualScroll(container, options)

new VirtualScroll(container, options)

Virtual scroll component.

Parameters:
Name Type Description
container HTMLElement | String

container element or id

options object

virtual scroll component options

Properties
Name Type Attributes Default Description
items Array.<String> <nullable>

items

spareItemCount Number <nullable>

count of spare items for display items

itemHeight Number <nullable>

item height

threshold Number <nullable>

pixel height from edge(start, end) of content for determining need emit scrollTop, scrollBottom event

containerHeight Number <nullable>

container height

scrollPosition Number <nullable>

scroll position

usageStatistics Boolean <optional>
true|false

send hostname to google analytics [default value is true]

Example
var VirtualScroll = tui.VirtualScroll; // require('tui-virtual-scroll');
var container = document.getElementById('virtual-scroll-container');
var instance = new VirtualScroll(container, {
    scrollPosition: 0,
    itemHeight: 150,
    spareItemCount: 5,
    layoutHeight: 400,
    items: items
});

Methods

append(items)

Append items.

Parameters:
Name Type Description
items Array.<{height: ?Number, contents: String}>

items

clear()

Clear items.

destroy()

Destroy.

getItemCount() → {Number}

Get item count.

Returns:
Number

getItems() → {Array.<String>}

Get items.

Returns:
Array.<String>

getScrollPosition() → {Number}

Get current scroll position value.

Returns:
Number

insert(items, index)

Insert items.

Parameters:
Name Type Description
items Array.<{height: ?Number, contents: String}>

items

index number

index

moveScroll(scrollPosition)

Move scroll position.

Parameters:
Name Type Description
scrollPosition Number

scroll position

prepend(items)

Prepend items.

Parameters:
Name Type Description
items Array.<{height: ?Number, contents: String}>

items

remove(index, shouldRerender) → {Array.<{height: Number, contents: String}>|Object}

Remove item or items by index.

  • If index type is number, remove one item.
  • If index type is array of number, remove items.
  • If second parameter is false, not rerendering.
Parameters:
Name Type Description
index Array.<Number> | Number

remove item index or index list

shouldRerender Boolean

whether should rerender or not

Returns:
Array.<{height: Number, contents: String}> | Object

resizeHeight(height)

Resize layout height.

Parameters:
Name Type Description
height Number

layout height

Events

scroll

Occurs when the scroll event.

Properties:
Name Type Description
eventData object

event data

Properties
Name Type Description
scrollPosition number

current scroll position

scrollHeight number

scroll height

movedPosition number

moved position

scrollBottom

Occurs when the scroll position is arrived bottom.

Properties:
Name Type Description
eventData object

event data

Properties
Name Type Description
scrollPosition number

current scroll position

scrollHeight number

scroll height

scrollTop

Occurs when the scroll position is arrived top.

Properties:
Name Type Description
eventData object

event data

Properties
Name Type Description
scrollPosition number

current scroll position

scrollHeight number

scroll height