如何使用查询组件实现反应虚拟化

时间:2019-07-11 09:29:58

标签: reactjs

我使用react-virtualized,必须将查询组件结果数组从列表组件传递到基于类的组件中的renderRow方法。

renderRow({ index, key, style, datalist, value }) {
    return (
      <div key={key} style={style} className="row">
        <div className="image">
          <img src={this.list[index].image} alt="" />
        </div>
        <div className="content">
          <div>{this.list[index].name}</div>
          <div>{this.list[index].text}</div>
        </div>
      </div>
    );
  }

<Query query={allKanBanQuery} variables={allKanBanQueryVars}>
  {(data, loading, error) => {
    if (data.error) return <p>{error}</p>;
    if (data.loading) return <div>Loading..</div>;

    return (
        <List
          width={rowWidth}
          height={listHeight}
          rowHeight={rowHeight}
          rowRenderer={this.renderRow}
          rowCount={data.data.kanbanlist.length}
        />    
    );
  }}
</Query>

如何在renderRow中传递data.data.kanbanlist数组。

谢谢。

0 个答案:

没有答案