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

Question

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

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

但在 v7 中它不起作用。

Answer 1

在 v7 中，Cell 使用 props 对象调用。其中一个 Prop 是 row，它具有您要查找的 original 属性。

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

您可以从 Prop 中解构行。

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