javascript - 首选 ES6 箭头函数语法格式

Question

我有一个 onChange 事件处理程序，它的结构如下:

(e) => (value => this.setState(prevState => ({
        form: {
            ...prevState.form,
            email: value
        }
    })))(e.target.value)

我把它缩小到这个

(e) => {
    let value = e.target.value;
    this.setState((prevState) => ({
        form: {
            ...prevState.form,
            password: value
        }
    }))
}

这些都不是很吸引人。我喜欢第一个 b/c，它少了 3 行代码，但它也有很多括号。有没有我可能遗漏的另一种变体可以进一步清理它？扩展运算符的使用增加了一个额外的括号，可以以某种方式删除它吗？

谢谢

Answer 1

您可以解构事件中的值，并将 setState 作为唯一的语句。

({ target: { value } }) => this.setState(prevState => ({
  form: {
    ...prevState.form,
    password: value
  }
}));