Реагирующий виртуализированный InfiniteLoader ничего не отображает

Как следует из названия, InfiniteLoader не отображает никаких элементов. Кажется, у меня все настроено правильно, и в коллекции есть много элементов для рендеринга, но на странице ничего не отображается. Вот метод рендеринга:

render() {
    const rows = this.state.rows
    const rowsCount = this.state.hasNextPage ? rows.length + 1 : rows.length

    // Only load 1 page of items at a time.
    // Pass an empty callback to InfiniteLoader in case it asks us to load more than once.
    const loadMoreRows = this.state.nextPageLoading ? () => {} : this.loadNextPage

    // Every row is loaded except for our loading indicator row.
    const isRowLoaded = ({ index }) => !this.state.hasNextPage || index < rows.length

    // Render a list item or a loading indicator.
    const rowRenderer = ({ index, key, style }) => {
      if (!isRowLoaded({ index })) {
        console.log("LOADING") // NEVER GETS CALLED
        return(
          <div style={style}>
            Loading...
          </div>
        )
      } else {
        console.log(rows[index]) // NEVER GETS CALLED
        return(
          <MyRow key={index}
            row={rows[index]} />
        )
      }
    }

    console.log(rows) // SHOWS AN ARRAY WITH PLENTY OF ROWS
    return(
      <InfiniteLoader
        isRowLoaded={isRowLoaded}
        loadMoreRows={loadMoreRows}
        rowCount={rowsCount}>
        {({ onRowsRendered, registerChild }) => (
          <AutoSizer>
            {({ height, width }) => (
              <List
                height={height}
                width={width}
                ref={registerChild}
                onRowsRendered={onRowsRendered}
                rowCount={this.state.totalCount}
                rowHeight={46}
                rowRenderer={rowRenderer}
              />
            )}
          </AutoSizer>
        )}
      </InfiniteLoader>
    );
  }

person trevorhinesley    schedule 08.05.2017    source источник
comment
Можете ли вы предоставить Plnkr, который воспроизводит эту проблему?   -  person bvaughn    schedule 08.05.2017
comment
@brianvaughn Я посмотрю, что я могу сделать!   -  person trevorhinesley    schedule 08.05.2017
comment
@brianvaughn plnkr.co/edit/TP5BTGNA0Me1Rz7Q7Ge9?p=preview   -  person trevorhinesley    schedule 08.05.2017


Ответы (1)


Проблема заключалась в том, что высота AutoSizer была равна 0. Решена путем включения AutoSizer в div с заданной высотой.

person trevorhinesley    schedule 08.05.2017
comment
Спасибо! Могу я спросить, как вы это догадались, если вы все еще помните. Вроде такой случайный баг - person Tariq; 03.08.2017