在地图迭代中添加额外的组件会产生错误

Question

我是React的新手。我有以下迭代，我在其中添加了<td>

<tr key={rowIdx}>{
    Array.from({length: numberOfColumn}).map((_, colIdx) => (
       <EditableCell key={colIdx}/>
    ))

}</tr>

现在我要添加一个额外的td，每个tr的末尾都具有删除按钮。

但是，它在以下位置显示错误。

<tr key={rowIdx}>{
    Array.from({length: numberOfColumn}).map((_, colIdx) => (
      <EditableCell key={colIdx}/>
    ))


   //Error is here
    <td>
      <input type="button" value="X"/>
    </td>

}</tr>

我不知道如何添加额外的TD。任何帮助将不胜感激。

Answer 1

下面是正确的格式

<tr key={rowIdx}>
    {Array.from({ length: numberOfColumn }).map((_, colIdx) => (
        <EditableCell key={colIdx} />
    ))}
    <td>
        <input type="button" value="X" />
    </td>
</tr>;