React-Virtualized naturalTableSort无法读取状态列表

时间:2019-07-16 06:04:52

标签: reactjs react-virtualized

我正在尝试使用react-virtualized实现自然表排序。我在github仓库上有一个例子。一旦我的代码中有了表格,就无法生成表格。我可以console.log我的道具和状态,但不能在桌子上。我不确定发生了什么。如果有人可以指出一篇好文章,那么对react-virtualized做出一个自然表排序将不胜感激。

代替使用数组解构,我只是简单地创建了一个新变量并分配了this.props。我也尝试过简单地称呼州。

        componentWillUpdate(nextProps, nextState) {
        const { sortBy: prevSortBy, sortDirection: prevSortDirection } = this.state;

        if (
          nextState.sortBy !== prevSortBy ||
          nextState.sortDirection !== prevSortDirection
        ) {
          const { sortBy, sortDirection } = nextState;

          let  { lists } = this.props;

          if (sortBy) {
            lists = lists.sortBy(item => item[sortBy]);
            if (sortDirection === SortDirection.DESC) {
              lists = lists.reverse();
            }
          }
        }
      }

      render() {
        const { lists , sortBy, sortDirection } = this.state;

        return (
          <Table
            {...this.props}
            sort={this._sort}
            sortBy={sortBy}
            rowHeight={400}
            rowCount={100}
            width={400}
            sortDirection={sortDirection}
            style={styles}
            rowGetter={({ index }) => this.props.lists[index]}
            height={400}
          >
            {/* <Column>s go here */}
            <Column label="Name" dataKey="name" width={100} />
            <Column label="Name" dataKey="email" width={100} />
            <Column width={200} label="Description" dataKey="account" />
          </Table>
        );
      }

      _sort({ sortBy, sortDirection }) {
        const { sortBy: prevSortBy, sortDirection: prevSortDirection } = this.state;

        // If list was sorted DESC by this column.
        // Rather than switch to ASC, return to "natural" order.
        if (prevSortDirection === SortDirection.DESC) {
          sortBy = null;
          sortDirection = null;
        }

        this.setState({ sortBy, sortDirection });
      }
    }

    export default NaturalSortTable;

列表已声明但未使用过。

0 个答案:

没有答案