微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

React array.map返回期望的赋值或函数调用,而是看到一个表达式

如何解决React array.map返回期望的赋值或函数调用,而是看到一个表达式

我编写了一个非常简单的react组件,在其中我尝试从jsonplaceholder / typicode网站获取API。我能够成功获取结果并将其设置为状态。现在,当我尝试使用array.map在屏幕上打印这些结果时,出现以下错误

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

这是组件的外观:

class App extends Component {
  constructor(props) {
    super(props);
    this.state = { 
      result: []
     }
  }

  componentDidMount() {
    fetch("https://jsonplaceholder.typicode.com/posts")
    .then(res=> res.json())
    .then(result=>{
      this.setState({
        result
      })
    })
  }
  
  render() { 
    return ( 
      <div>
        {this.state.result.map(post=>{
          <h1>{post.title}</h1>
        })}
      </div>
     );
  }
}

我不明白我在做什么错。有人请看

解决方法

您忘记了return

<div>
  {this.state.result.map((post) => {
    return <h1>{post.title}</h1>
  })}
</div>

用于演示的Codesandbox

Edit affectionate-borg-hugm9

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。