每次只从这个 map 方法中获取最后一个元素答案

【问题标题】：Getting only last element from this map method every time每次只从这个 map 方法中获取最后一个元素
【发布时间】：2021-11-02 20:17:39
【问题描述】：

OnSubmit 我正在调用handleSubmit 函数，它有两个参数事件，文档。

const handleRename = (e, doc) => {
    console.log(doc); 
}

现在在渲染部分我有每个元素的数组和模型形式，如下所示：

{
   ArrayName.map((doc) => {
      <form onSubmit={(e) => handleRename(e, doc)}>
        ...
      </form>
}

我每次都获取 Array 的最后一个元素，而不是获取单个文档。有谁知道怎么回事？

提前谢谢你

【问题讨论】：

【解决方案1】：

试试改成

ArrayName.map((doc) => {
  return (<form onSubmit={(e) => {handleRename(e, doc)}}>
    ...
  </form>)

阅读this该页面将最好地解释错误。检查高级语法

(e) => handleRename(e, doc) 这部分代码，而不是返回一个函数，而是立即对其求值。

【讨论】：

【解决方案2】：

您在正确的轨道上，但您只是错过了从数组映射中返回组件。

ArrayName.map((doc) => {
   return (
      <form onSubmit={(e) => handleRename(e, doc)}>
         ...
      </form>
   );
}

或者更好的是简写return语句：

ArrayName.map((doc) => (
    <form onSubmit={(e) => handleRename(e, doc)}>
       ...
    </form>
));

更多关于map的信息。

【讨论】：