<p>저는 반응 js를 가지고 있고 tanstack 테이블(react-table)을 구현했습니다. 각 행의 상태에 따라 버튼/링크를 표시하거나 숨기도록 만드는 데 도움이 필요합니다.
"승인" 상태가 포함된 행이 있으면 버튼이 표시되고 그렇지 않으면 숨겨질 것이라고 가정합니다. </p>
<pre class="brush:php;toolbar:false;">......일부 데이터 초기화
const [sorting, setSorting] = useState<SortingState>([]);
const [rowSelection, setRowSelection] = useState({});
const [isApproved, setIsApprove] = useState(false);
...호출 열
const columns = useMemo<ColumnDef<IEvent>[]>(
...열 목록
{
accessorKey: "상태",
헤더: () =>
상태,
셀: (셀: 임의) =>
let status = cell.getValue();
return cell.getValue();
},
활성화 정렬: true,
활성화열필터: 참,
},
{
accessorKey: "작업",
헤더: () =><span>Action</span>
셀: (셀: 임의) =>
console.log(isApproved);
반품 (
<div className="inline-flex gap-x-2">
<링크={`./${cell.row.id}/edit`}>수정</Link>
<EVSDeleteButton id={cell.row.id} 헤더="이벤트"
<링크={`./${cell.row.id}/agenda`}>의제</Link>
</div>
);
},
활성화 정렬: 거짓,
활성화열필터: 거짓,
},</pre>
<p>각 행의 상태에 따라 버튼('일정')을 표시하거나 숨길 수 있기를 원합니다</p>
![[웹 프런트엔드] Node.js 빠른 시작](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
삼항 연산자, 조건부(삼항) 연산자
를 사용해 본 적이 있나요?
으아악cell.row.original.status访问每行的status값을 사용하여 상태 변수에 저장하는 대신 해당 값을 기반으로 버튼을 표시할 수 있습니다.