函数组件中React中如何获取子节点索引onClick

Question

考虑下面的代码

function getChildIndex(){
//logic here
}

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

它将呈现如下

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

点击子元素时如何获取子元素编号

Answer 1

index 可用作 map's 回调函数的第二个参数，正如您还展示的那样。只需根据需要使用它：-

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

函数组件中React中如何获取子节点索引onClick

How to get the childNode index onClick in React in functional component

javascript

dom-events

reactjs

react-functional-component