Je dois implémenter le tri de table par colonne, donc je réécris mon composant de table React à l'aide du composant ReactTable de ReactTable.
L'une des cellules du tableau contient un lien et doit accéder à plusieurs propriétés de ligne. Jusqu'à présent, le code de la colonne de lien ressemble à:
{
Header: "Name",
accessor: "name",
Cell: cellInfo => (
<Link className="scenarioDetailLink"
to={cellInfo.row.linkDestination}
id={cellInfo.row.linkName}>{cellInfo.row.name}</Link>
)
},
Il en résulte des éléments comme celui-ci:
L'élément d'ancrage généré n'a pas les propriétés id et href. Qu'est-ce que je fais mal.
Il s'est avéré que je devais utiliser cellInfo.original plutôt que cellInfo.row. Lorsque vous fournissez un rendu Cell
, vous devez utiliser cellInfo.original
pour accéder à toutes vos données de ligne (surtout si vous ne les affichez pas sous forme de colonnes). Le row
n'a que ce qui est affiché dans le tableau.