시맨틱 UI를 사용하여 테이블에서 데이터를 가져올 수 있습니다. React

Question

React를 배우고 React Semantic UI를 사용하려고합니다. 테이블이있어 데이터를 가져 오는 방법을 알 수 없습니다. 체크 박스를 클릭 할 때 사용자의 ID를 얻고 싶습니다. 그러나 어떻게해야하는지 (예를 들어, 이것은 기본적인 기본 질문 일 뿐이며 뭔가를 간과하고있을 것입니다) 어떤 예도 찾을 수 없습니다. 내가 처음에 행 클릭의 데이터를 얻기 위해 노력했습니다 테이블이

<Table collapsing compact celled definition> 
    <Table.Header> 
     <Table.Row> 
     <Table.HeaderCell /> 
     <Table.HeaderCell>First Name</Table.HeaderCell> 
     <Table.HeaderCell>Last Name</Table.HeaderCell> 
     </Table.Row> 
    </Table.Header> 

    <Table.Body> 
     {students.map(student => <Table.Row key={student.student_id} onClick = {handleRowClick}> 
     <Table.Cell collapsing> 
      <Checkbox /> 
     </Table.Cell> 
     <Table.Cell 
      children = {student.fname}> 
     </Table.Cell> 
     <Table.Cell 
      children = {student.lname}> 
     </Table.Cell> 
     </Table.Row>)} 
    </Table.Body> 
    </Table> 

처럼 내가 떨고있어 어디 행 클릭 기능입니다. 나는 여러 가지를 시도했지만 일반적으로 정의되지 않습니다.

 handleRowClick = (student) => {console.log(this.props.children);} 

나는 같은 ( How to get data from table row click using Semantic's React Table Component)을 보이는이 질문을 찾았지만 나는 그것이 bind를 사용하여 비교적 쉽게

Answer 1

당신이 할 수있는 일을 얻을 수 없습니다.

바인드() 새로운 함수가 호출 될 때 방법이 어떤 제공 선행 인수 지정된 시퀀스,라고 할 때, 그 제공된 값으로 설정이 키워드를 갖는 새로운 기능을 생성한다 MDN 가입일 . 지도 기능에서

, 당신은 student에 액세스 할 수 있습니다, 그래서 당신은이처럼 onClick 기능에 바인딩 할 수 있습니다

이

{students.map(
    student => <Table.Row onClick={handleRowClick.bind(this, student)}/> 
)} 

그런 다음 함수의 첫 번째 매개 변수로 student에 액세스 할 수 있습니다

handleRowClick = (student) => console.log(student) 

다른 매개 변수는 필요한 경우 student 이후에 채워집니다.