如何从子组件中的另一个反应 table 中获取 React-table 中 "parent" table 的行号？

Question

我正在使用 react-table 和 "parent" table，它的子组件与另一个反应 table。

我需要在内部table的单元格编辑中使用父级的行号。

我正在尝试生成一个新道具，它将传递父级的 row.index 值，如下面的 parentRow = {row.index} 所示。但是我没有通过 row.index 值。

简而言之：如何通过父组件的row.index来反应子组件中的table？

感谢任何帮助。

      <ReactTable
          data={this.props.data}
          columns = {this.WP2columns}
          pageSize={this.props.data.length+1}
          showPagination={false}
          className="-striped -highlight"
          SubComponent={row => {
            return (
              <div style={{ padding: "0 20px" }}>
                {console.log("WP2 SUBTABLE row=", row) }
                <ReactTable
                  data = {row.original.familywp_goal_tasklist}
                  columns={this.subcolumns}
                  parentRow = {row.index}
                  defaultPageSize={3}
                  showPagination={false}
                />
              </div>
            )
          }}
        />

Answer 1

在 SubComponent 中使用 resolveData 属性传递父行索引。

      <ReactTable
          data={this.props.data}
          columns = {this.WP2columns}
          pageSize={this.props.data.length+1}
          showPagination={false}
          className="-striped -highlight"
          SubComponent={row => {
            return (
              <div style={{ padding: "0 20px" }}>
                <ReactTable
                  data = {row.original.familywp_goal_tasklist}
                  resolveData={data => data.map(d => {
                    return {
                      ...d,
                      parentRow: row.index
                    }
                  })}
                  columns={this.subcolumns}
                  defaultPageSize={3}
                  showPagination={false}
                />
              </div>
            )
          }}
        />

现在在单元格编辑参数中你将有 original.parentRow prop.

如何从子组件中的另一个反应 table 中获取 React-table 中 "parent" table 的行号？

How to get row number of "parent" table in React-table from another react table in sub component?

reactjs

react-table