Question

我制作了一个“ App”类，并在子“ Todos”组件中传递了一个状态作为道具。

看看我的代码：

class App extends Component {

  state = {
  todos:[
    {
      id:1,
      title:'task1',
      complete:false,
    },{
      id:2,
      title:'task2',
      complete:false,
    },{
      id:3,
      title:'task3',
      complete:false,
    }
  ]
}

render() {
  return (
    <div className="App">
      <Todos todos={this.state.todos}/>
    </div>
  );
 }
}

我的Todos组件：

class Todos extends Component {
  render() {
    return this.props.todos.map((list)=>{list.title});
  }
}

现在在地图功能的Todos组件内部，不允许使用花括号，但是如果用圆括号替换，可以吗？

请帮助我。对结构错误的问题表示抱歉。

Answer 1

如果使用花括号，则表示您正在编写函数，并且应最后返回一些jsx，但是您的代码没有返回任何jsx。因此有效的代码应该是

return this.props.todos.map((list)=>{ return list.title});

，带有圆括号的代码可以正常工作，因为这是写退货的捷径。因此，基本上使用圆括号，您的代码仍然像这样

return this.props.todos.map((list)=>{ return list.title});

一些有效的方法：

return this.props.todos.map((list)=>{ return list.title});

return this.props.todos.map((list)=> list.title);

与地图功能反应时出现“ no-unused-expressions”错误

1 个答案: