Comment faire le tri par défaut dans react-table

Question

J'utilise react-table v7 https://www.npmjs.com/package/react-table pour créer des tables.

1. Je suis capable de faire du tri sur toutes les colonnes en me référant à cet exemple de tri https://codesandbox.io/s/github/tannerlinsley/react-table/tree/master/examples/sorting . Maintenant, je ne veux pas que toutes les colonnes soient triées mais quelques colonnes spécifiques et je veux trier 2 colonnes par défaut par ordre décroissant. Quelqu'un pourrait m'aider avec ça.

2. Après avoir appliqué des filtres à la table, je souhaite effacer tous les filtres appliqués. Quelqu'un peut-il également aider à résoudre ce problème?

Je vous remercie

Answer 1

Merci beaucoup ! J'ai enfin trouvé la réponse! À propos du tri par défaut, j'ai trié les données de la table par ordre décroissant et j'ai obtenu les données par défaut en ordre décroissant. Et pour le bouton d'effacement Comment effacer tous les filtres dans react-table , veuillez vous référer à ce lien!

Answer 2

Vous devez importer le plugin 'useSortBy' pour le faire fonctionner

import React from 'react'
import { useTable, useSortBy } from 'react-table';

function Table({ columns, data, ...rest }) {
    const {
        getTableProps,
        getTableBodyProps,
        headerGroups,
        rows,
        prepareRow,
    } = useTable({
        columns,
        data,
        ...(rest.initialState && {
            initialState: rest.initialState
        })
    }, useSortBy);