roeierez / infinite-list

Infinite list in javascript that scrolls in 60fps
623 stars 45 forks source link

Compatibility with ReactJS 15 #18

Closed agungsb closed 7 years ago

agungsb commented 7 years ago

I've tried to use this plugin along with ReactJS 15 but don't get it works.

componentDidMount() {
    const list = new InfiniteList({
      itemRenderer: function (index, domElement) {
        <div {...listData[index]}>{domElement}</div>
      },
      pageFetcher: function (fromIndex, callback) {
        if (fromIndex == ITEMS_COUNT) {
          callback(0, false);
          return;
        }
        setTimeout(function () {
          callback(100, true);
        }, 2000);
      },
      initialPage: {
        hasMore: true,
        itemsCount: 100
      }
    });
    list.attach(document.getElementById('main'));
}

Any thoughts? Thanks.

roeierez commented 7 years ago

Hi, This does not work because the domElement is not a React Element. For your use case just replace the line inside the itemRenderer to:

ReactDOM.render(<div {...listData[index]}></div>,domElement)

This will render your list item to the target domElement.