使用映射时反应错误

-1

我在我的反应组件中使用映射来遍历列表。当我在地图循环中有一个链接时它工作正常，但是当我尝试为它创建一个优化的构建时，我的第二个链接返回一个错误。 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> 
            )}

来源

2017-02-21 Nick Pocock

...你得到什么错误？ – Maakep

我想你可能在你完成之前发布了这个问题，因为它是如何在句子结尾处结束的。什么是确切的错误信息？这段代码在哪里出现？什么是“链接”？（据推测，在某个阶段，'Link'将'li'包装在'ul'或'ol'中？） –

Yashika回答了这个问题，但是谢谢。 –

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> 
           )}

来源

2017-02-21 08:43:32

的问题是，您在里面map返回多个项目，因此不能返回一个以上的元素，所以你需要通过任何div或li包裹Link和a或通过任何其他元素。试试这个：

{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> 
)}

来源

2017-02-21 08:44:07

使用映射时反应错误

回答

相关问题