web-dev-qa-db-ja.com

反応テーブルでデフォルトのソートを行う方法

テーブルの作成に、react-table v7 https://www.npmjs.com/package/react-table を使用しています。

  1. この並べ替えの例 https://codesandbox.io/s/github/tannerlinsley/react-table/tree/master/examples/sorting を参照することで、すべての列を並べ替えることができます。ここで、すべての列を並べ替える必要はありませんが、特定の列をいくつか並べ替え、デフォルトで2列を降順で並べ替えます。誰かがこれを手伝ってくれませんか？.

  2. テーブルにフィルターを適用した後、適用したフィルターをすべてクリアしたいと思います。誰かもこの問題を解決するのを手伝ってくれませんか？

ありがとうございました

javascriptreactjssortingfilterreact-table
4
Blessy Julie

どうもありがとう ！私は最後に答えを整理しました！デフォルトのソートについて、テーブルのデータを降順でソートし、デフォルトでデータを降順として取得しました。そして、クリアボタン react-tableのすべてのフィルターをクリアする方法 については、このリンクを参照してください！

0
Blessy Julie

「useSortBy」プラグインをインポートして機能させる必要があります

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);
0
Khai Nguyen