vscrollr.js

Virtual scrolling list with relative positioning

Install

npm install --save vscrollr.js

Usage

import React from 'react'

import List from 'vscrollr.js'

class Example extends React.Component {
  state = {
    items: staticItems,
  };
  
  rowRenderer = ({index, key, isVisible, isScrolling, setRef}) => {
    const {items} = this.state;
    let item = items[index];
    return (
      <div key={key} ref={setRef}>
        {item}
      </div>
    )
  };
  
  render () {
    const {items} = this.state;
    return (
      <div className="scroll-container">
        <List
          rowsCount={items.length}
          rowRenderer={this.rowRenderer}
          containerClassName="scroll-container"/>
      </div>
    )
  }
}

License

MIT © SQReder