当在地图中返回HTML时，围绕箭头体错误的块声明

Question

我明白这个问题之前已经被问过了，但是我无法弄清楚linter在我目前的情况下想要的语法。

我明白我需要删除块语句括号，但无法弄清楚如何重构，以得到它的工作，并通过皮棉：

return (
    <div> 
    { 
     paymentSchedule.map((payment) => { 
     return (
      <div>{payment.description}</div> 
     ); 
     }) 
    } 
    </div> 
); 

这将产生以下皮棉错误：

Unexpected block statement surrounding arrow body

Answer 1

使用此：

return (
    <div> 
     { 
     paymentSchedule.map(payment => <div key={payment.description}>{payment.description}</div>) 
     } 
    </div> 
); 

原因：这里不要求块语句，因为你只是想返回div，直接用上面的方式。

建议：为每个元素指定唯一键，否则它将抛出警告。