javascript - 使用 map 时 react 错误

Question

我在我的 react 组件中使用 map 来循环列表。当我在 map 循环中有一个链接时它工作正常，但是当我尝试为其创建优化构建时，我的第二个链接会返回错误。 Intellij 给我一个错误，在我的 <a it expects either a ',' or a ')' 之后说。我看不出我错过了括号或任何东西。

{this.state.players.map(singlePlayer =>
       <Link to={'edit-player/' + singlePlayer.id}><li key={singlePlayer.id}>{singlePlayer.name}</li></Link>
       <a id={singlePlayer.id} onClick={this.handleDelete.bind(this)}>delete</a>
                                    )}

Answer 1

map 应仅返回一个元素。所以你的代码应该是

{
  this.state.players.map((singlePlayer) => (
    <div>
      <Link to={"edit-player/" + singlePlayer.id}>
        <li key={singlePlayer.id}>{singlePlayer.name}</li>
      </Link>
      <a id={singlePlayer.id} onClick={this.handleDelete.bind(this)}>
        delete
      </a>
    </div>
  ));
}