如何在功能组件中获取React中的childNode索引onClick

Question

Coinsider the code below

function getChildIndex(){
//logic here
}

//render 
<div>
{Array.from({length: 3}).map((item,index) => (
            <div onClick={getChildIndex}/> 
        )
        )}
</div>

it will render as follow

<div>
     <div> //with click event // 1st Child
     <div> //with click event // 2nd Child
     <div> //with click event // 3rd Child
</div>

How can i get the child element number when i click the child element

Answer 1

The index is available as 2nd argument of map's callback function as you also showed. Just use it as required like so:-

<div onClick={()=>doSomethingWithIndex(index)}/>