javascript - "(.....);"和 "{......}"在 react 中有什么区别？

Question

我收到以下代码的图像中显示的错误:

handlechange(event) {
    this.setState (prevState => {
      return(
      checked : !prevState.checked
    );});
}

但是当我将“返回”后的圆括号更改为 curl 时，它运行良好。我的意思是引擎盖下发生了什么？是什么导致错误消失？

handlechange(event) {
    this.setState (prevState => {
      return{
      checked : !prevState.checked
    }});
}

Answer 1

这不是 React 的事情。您的第一个示例只是无效的 JavaScript 语法。¹您的第二个示例是有效语法，返回通过对象初始值设定项创建的对象(通常称为对象“文字”，{checked: !prevState.checked}) .

---

¹ return 之后的 () 包裹了一个表达式，然后在表达式中你有 checked: !prevState.checked 看起来像带标签的声明。但是您不能在需要表达式的地方放置带标签的语句。

---

旁注:另一种写法是在参数列表中使用属性解构，在对象初始化器中使用简写属性:

handlechange(event) {
    this.setState(({checked}) => {
      checked = !checked;
      return {checked};
    });
}