react setState 箭头函数括号问题

从官方API中可以看到示例：

State 的更新可能是异步的，出于性能考虑，React 可能会把多个 setState() 调用合并成一个调用。

要解决这个问题，可以让 setState() 接收一个函数而不是一个对象。这个函数用上一个 state 作为第一个参数，将此次更新被应用时的 props 做为第二个参数：

// Correct
this.setState((state, props) => ({
  counter: state.counter + props.increment
}));

为什么箭头函数返回值要用小括号包括起来？

因为 大括号 是 函数主体 的标志。而箭头函数若要返回 自定义对象 的话，就必须用 小括号 把该对象括起来先。

比如:

var getTempItem = id = > ({
    id: id,
    name: "Temp"
});
// 等同于：
var getTempItem = function(id) {
    return {
       id: id,
       name: "Temp"
    };
};

上例可以看出，用小括号包含大括号则是对象的定义，而非函数主体。

总结一下箭头函数括号问题：

箭头函数根据传入函数个数，细分需不需要使用小括号()：

1. 无参或者>=2个传入参数的时候，要使用小括号。
2. 1个传入参数的时候可以省略小括号，

但是我建议为了统一都使用小括号。

箭头函数根据返回值类型，细分需不需要使用小括号 () 来包住大括号 {}，就是这种形式 ({})：

1. 返回值是一个对象
   返回值是一个对象的时候，因为大括号是函数主体的标志，所以必须用小括号把该对象括起来。
2. 返回值非对象
   返回值不是一个对象的时候，会根据函数体来细分需不需要使用大括号{}
   • 函数体只有一句 return xxx ,则可以省略大括号。
   • 函数体有其他执行语句的时候，就必须使用大括号。
     但是我建议为了统一都使用大括号。