안녕하세요 확인란을 사용하지 않고 React-table에서 행을 선택할 수 있습니까? 선택하려는 행을 클릭 한 다음 선택한 행에서 데이터를 가져오고 싶습니다. 가능하다면 예제를 제공 할 수 있습니까?
클릭을 감지하는 Row 구성 요소에 대한 이벤트 리스너를 등록해야합니다. 리스너가 호출되면 애플리케이션 상태를 변경하여 사용자가 선택한 항목을 기록 할 수 있습니다. 그러면 사용자가 선택 사항을 "볼"수 있도록 테이블의 모양을 변경하는 데 사용할 수 있습니다. (예 : 행의 배경색 변경).
react-table사용자 정의 Hooks API를 기반으로 한 최신을 사용하는 경우onClick핸들러를 row.getRowProps함수에 전달 하여 모든 tr요소 에 추가 할 수 있습니다 . row.setState행을로 설정 하는 데 사용할 수도 있습니다 selected.
<tbody {...getTableBodyProps()}>
{rows.map((row, i) => {
return (
<tr {...row.getRowProps({
onClick: () => { /* select the row here */ }
})}>
{row.cells.map(cell => {
return /* your cell code */
})}
</tr>
)
})}
</tbody>
react-table@v6이전을 사용하는 경우행에 대한 정보 를 수신 하고 요소가 수신 할 모든 소품을 반환해야하는 함수를받는 <ReactTable />호출 getTrProps된 구성 요소 소품을 사용 tr합니다. 예를 들면 다음과 같습니다.
<ReactTable
getTrProps={(_, row) => {
return {
onClick: () => { /* select your row here */ }
};
}}
/>
이 기사는 인터넷에서 수집됩니다. 재 인쇄 할 때 출처를 알려주십시오.
침해가 발생한 경우 연락 주시기 바랍니다[email protected] 삭제
몇 마디 만하겠습니다