2017-12-26 14 views
0

버전 단계 지금 를 재현하려면 테이블에서 행을 확장 할 수 있습니다 3.0.3버튼을

환경 PC, 크롬

생식 링크 https://codesandbox.io/s/my02ok19wy

을 클릭하여 Antd 테이블 행을 확장하는 방법 두 가지 방법 : 1. 첫 번째 열에서 아이콘을 사용하십시오; 2. expandRowByClick이 true 인 전체 행을 클릭하십시오. 하지만 그건 내가 원하는 것이 아닙니다. 다른 열에서 버튼을 사용하고 싶습니다. 아마도 '더보기'버튼 일 것입니다. 그런 다음 '더보기'를 클릭하면 행이 확장됩니다. 이것을 실현하는 방법?

데모 쇼를 핥고, 첫 번째 셀의 버튼을 클릭하는 대신 '더보기'를 클릭하여 행을 확장하고 싶습니다. 감사합니다

예상 되나요? 첫 번째 셀에없는 버튼 하나를 클릭하여 하나의 행을 확장하십시오.

실제로 어떤 현상이 일어나고 있습니까? 행의 첫 번째 셀에있는 버튼을 클릭해야합니다. 버튼을 다른 셀로 이동할 수 없습니다.

답변

0

가능하지만 코드를 작성하는 것을 선호하지 않지만 어떻게 설명 할 것입니다.

확장하려는 행의 키를 지정하는 소품 호출 expandedRowKeys이 있습니다.

따라서 expandedRowKeys={[1,3]}에서 <Table />까지 추가하면 첫 번째와 세 번째 행이 확장됩니다.

이제 행 키 배열을 조작하려면 handleClickMore 함수를 구현하기 만하면됩니다. 그리고 어떻게 생겼는지.

expandedRowKeys={this.state.expandedKeys}