Tanstack Table と React JS: React JS と Tanstack Table を使用するときに状態に基づいてボタンを表示/非表示にする方法
P粉042455250
P粉042455250 2023-09-02 23:04:17
0
2
615

私はreact jsとtanstackテーブル(react-table)を実装しました。各行の状態に基づいてボタン/リンクを表示または非表示にするのに助けが必要です。 ステータスを含む行がある場合は「承認」ボタンが表示され、そうでない場合は非表示になるとします。

......一部のデータを初期化します const [sorting, setSorting] = useState([]); const [rowSelection, setRowSelection] = useState({}); const [isApproved, setIsApprove] = useState(false); ...呼び出し列 const columns = useMemo[]>( ...列のリスト { accessorKey: "ステータス"、 ヘッダー: () => ステータス, セル: (セル: 任意) => { let status = cell.getValue(); 戻り cell.getValue(); }、 イネーブルソート: true、 EnableColumnFilter: true、 }、 { accessorKey: "アクション"、 ヘッダー: () => アクション, セル: (セル: 任意) => { console.log(承認済み); 戻る ( 
<リンク先={`./${cell.row.id}/edit`}>編集 <リンク先={`./${cell.row.id}/agenda`}>議題
); }、 イネーブルソート: false、 EnableColumnFilter: false、 },

各行の状態に応じてボタン(「議題」)を表示/非表示にできるようにしたいです

P粉042455250
P粉042455250

全員に返信 (2)
P粉555682718

三項演算子条件付き (三項) 演算子

を使用したことがありますか?
いいねを押す+0
    P粉006847750

    cell.row.original.statusを使用すると、各行のstatus値にアクセスし、ステータス変数に値を保存する代わりに、その値に基づいてボタンを表示できます。リーリー

    いいねを押す+0
      最新のダウンロード
      詳細>
      ウェブエフェクト
      公式サイト
      サイト素材
      フロントエンドテンプレート
      私たちについて 免責事項 Sitemap
      PHP中国語ウェブサイト:福祉オンライン PHP トレーニング,PHP 学習者の迅速な成長を支援します!