[英]How can I pass the index of an array into a reactJs onClick?
const Test = ({ inventory }) =>
<div className="row">
{inventory.map((item, i) =>
<div className="item" key={"item_" + i}>
<div className="card hoverable col s3">
<img onClick={buyItem(i)} src={item.img} alt="" />
<div className="container center-align">
<h4 className="">
{item.name}
</h4>
<p>
Price: {item.price}
</p>
<p>
Average price paid: {item.averageDisplay}
</p>
<p>
Amount owned: {item.owned}
</p>
<button
className="btn"
data={item.index}
onClick={sellItem(i)}
name="button"
>
Sell
</button>
</div>
</div>
</div>
)}
</div>;
ReactDOM.render(<Test inventory{inventory}/>,
document.getElementById("container")
);
库存是一个对象数组,在此示例中,我已经成功地遍历了所有对象,但是由于某些原因,尽管已经将i的值用于生成唯一键,但我仍无法弄清楚如何将i的值传递给该函数。
您需要创建一个新功能
onClick={() => sellItem(i)}
通过创建函数调用来像这样使用它
onClick={(event) => buyItem(event, i)}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.