在数组上反应映射以创建列表[重复]答案

【问题标题】：React map over array to create list [duplicate]在数组上反应映射以创建列表[重复]
【发布时间】：2019-08-30 07:30:44
【问题描述】：

我正在尝试在反应中映射一个非常简单的数组，但总是接收

Expected an assignment or function call and instead saw an expression  no-unused-expressions

这是代码

render() {
  const arr = [1, 2, 3, 4, 5];
  return (
    <div>
      <ul>
        <li>{this.state.amount}</li>
        {arr.map((e) => {
          <li key={e}>
            {e}
          </li>
        })}
      </ul>
    </div>
  );
}

对我来说，所有教程和示例中的所有内容都像 https://reactjs.org/docs/lists-and-keys.html

【问题讨论】：

您忘记了地图回调函数中的返回，这就是出现错误的原因。像这样写：{arr.map((e) => ( <li key={e}> {e} </li> ))} 或添加返回：{arr.map((e) => { return <li key={e}> {e} </li> })}

标签： javascript reactjs

【解决方案1】：

地图中缺少返回语句：

render() {
  const arr = [1, 2, 3, 4, 5];
  return (
    <div>
      <ul>
        <li>{this.state.amount}</li>
        {arr.map((e) => {
          return <li key={e}>
            {e}
          </li>
        })}
      </ul>
    </div>
  );
}

【讨论】：

【解决方案2】：

我认为如果在渲染中调用 map() 会更容易跟踪事物。

render(){
const arr = [1, 2, 3, 4, 5];
let listItem = arr.map(each =>{
    return( 
    <li key = {e}>
        {e}
    </li>)
})
return (
  <div>
    <ul>
      <li>{this.state.amount}</li>
        {listItem} 
    </ul>
  </div>
);

【讨论】：

好点，感谢您的反馈。