클릭하면 목록의 색인을 얻습니다.

Question

Stack Overflow에서 여기에 나오는 예제를 따르려고하고 있으며 제대로 작동하지 않습니다. 그래도 "색인"이라고하는 모든 것을 제거하면 제대로 작동합니다. 그것은 "페이지"에 잘 전달됩니다. 누군가 올바른 결정을 내게 가르쳐 주시겠습니까? 감사합니다.

내 클릭 기능

handleOnClick(page, index) { 
    console.log(page); //page is correct 
    console.log(index); //undefined 

} 

이

let self = this; 

    playlistList[pos].list.map(function(page, index) 

    {if (page.selected) { 
     return (
     <tr key={page.id} onClick={() => self.handleOnClick(page, index)}> 
      <td>{page.name}</td> 
      <td>{page.subComposition.name}</td> 
     </tr> 
    );} 
    } 

Answer 1

당신이 당신의 기능 "handleOnClick는"이 정확하다는 슈어 있습니까 렌더링 내? 나는 매개 변수가 잘못되었다고 생각한다.

함수를 호출

당신은 handleOnClick (페이지, 인덱스)를 통과하고, 방법의 매개 변수는 handleOnClick (인덱스 페이지)

Answer 2

당신은 아마 TR을 만들어 처리하는 구성 요소를 만드는 것이 더 낫다. 그런 다음 해당 구성 요소에 함수를 만든 다음 전달 된 소품을 사용하여 함수를 실행합니다.

상태를 변경해야하는 경우가 아니면 기능을 사용할 구성 요소로 전달하십시오.

Answer 3

화살표 함수 parentesis에서 매개 변수 이름을 전달해야하며, parentesis 함수를 통해 값을 전달해야합니다.

처럼 :

onClick={(page, index) => self.handleOnClick(page, index)}