私は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`}>編集); }、 イネーブルソート: false、 EnableColumnFilter: false、 },<リンク先={`./${cell.row.id}/agenda`}>議題
各行の状態に応じてボタン(「議題」)を表示/非表示にできるようにしたいです
三項演算子条件付き (三項) 演算子
を使用したことがありますか?cell.row.original.status
を使用すると、各行の
status値にアクセスし、ステータス変数に値を保存する代わりに、その値に基づいてボタンを表示できます。
リーリー