有两个'=>'，箭头函数中不是只有一个'=>'，这是什么意思？[副本]

Question

const handleChange = name => event => {
setState({ ...state, [name]: event.target.checked });
};

请参见CodeSandBox中的完整代码。

Answer 1

argumentName=>returnvalue是(argumentName)=>{return returnvalue；}的缩写

因此，您的代码等效于

const handleChange = (name) => {
  return (event) => {
    setState({...state, [name]: event.target.checked});
  }
}

换句话说，handlechange是一个函数，它本身返回另一个函数，而这个内部函数执行setstate()调用。

const foo = handleChange("Bar");

foo = (event) => {
  setState({...state, "Bar": event.target.checked});
}

const createHandleOnChangeFunction = name => event => {
    setState({ ...state, [name]: event.target.checked });
};

现在这个函数的作用更清楚了...它创建一个处理onChange事件的函数。