react-table - 如何从 v7 (React-Table) 中的列访问另一列的值

Question

我在以前的版本中看到您可以使用以下方式访问它：

const columns = [
  {
    Header: "Name",
    accessor: "name",
    Cell: (e) => {
      return e.original.name;
    }
  }
];

但是在 v7 中它不起作用。

Answer 1

在 v7 中Cell，使用props对象调用。其中一个道具是row具有original您正在寻找的属性的道具。

{
  Header: 'Name',
  Cell: (props) => {
    return (
      <>{props.row.original.lastName}, {props.row.original.firstName}</>
    );
  }
},

row您可以从道具中解构。

{
  Header: 'Name',
  accessor: 'firstName',
  Cell: ({row, value}) => (
    <span onClick={() => alert(row.original.lastName)}>{value}</span>
  )
},