[英]React Hooks onClick in list item
I have a list and I wanna set 'onClick' function which click to each item then show detail of item.我有一个列表,我想设置'onClick' function 单击每个项目然后显示项目的详细信息。 But my function returned undefine object I used react hooks and functional component
但是我的 function 返回 undefine object 我使用了反应钩子和功能组件
here is my code这是我的代码
var listItem = data.map((i, index) => (<Item key={index}
isRead={i['isRead']}
image={i['image']}
content={i['content']}
time={i['time']}
onClick={(i) => console.log('Click to',i.content)}
></Item>));
return (
<div className="Conversation">
<div className="ScrollDiv">
{listItem}
</div>
</div>
);
The i
parameter in the callback function represents the event that gets passed to the callback, and by naming that variable i
you prevent the callback from using i
from the outer scope.回调 function 中的
i
参数表示传递给回调的事件,通过命名该变量i
可以防止回调使用外部 scope 中的i
。
You need to remove the i
parameter of the callback function:需要去掉回调function的
i
参数:
onClick={() => console.log('Click to',i.content)}
or rename it to something else:或将其重命名为其他名称:
onClick={(event) => console.log('Click to',i.content)}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.