Javascript 咖喱

嗨，有人能在下面的例子中解释一下这种咖喱是如何工作的吗

名称参数我能理解，但事件？怎么做的

 <TextField
          placeholder="Name"
          InputLabelProps={{
            shrink: true,
          }}
          className={classes.textfield}
          value={name}
          onChange={this.handleChange('name')}
 />

 handleChange = name => (event) => {
    this.setState({
      [name]: event.target.value,
 });
};

handleChange=name=>（事件=>{
这是我的国家({
[名称]：event.target.value，
});
};

---

问候语

想想下面的代码

handleChange = name => (event) => {
    this.setState({
      [name]: event.target.value,
 });

作为

---

因此，基本上调用handleChange，比如

this.handleChange（'name'）

将函数返回到

onChange

事件。触发时的onChange将使用

事件

参数调用此方法。现在，返回的函数与外部handleChange函数形成了一个闭包，它可以使用其封闭范围中的

name

变量，这就是上面的currying代码的工作方式

思考下面的代码

handleChange = name => (event) => {
    this.setState({
      [name]: event.target.value,
 });

作为

因此，基本上调用handleChange，比如

this.handleChange（'name'）

将函数返回到

onChange

事件。触发时的onChange将使用

事件

参数调用此方法。既然返回的函数与外部handleChange函数形成了一个闭包，那么它就可以使用其封闭范围中的

name

变量，这就是上面带有currying的代码的工作方式

(event) => {
  this.setState({
    [name]: event.target.value
  })
}

现在，我们的情况也一样

<TextField
    ...
    value={name}
    onChange={this.handleEvent}
/>
//[name] now become yourName. It's `closure`
handleEvent = (event) => this.setState({yourName: event.target.value})

//[姓名]现在成为你的姓名。结束了`
handleEvent=（event）=>this.setState（{yourName:event.target.value}）

和

事件

现在表示启动函数时的

文本字段

。

this.handleChange（'name'）

在初始化时启动，返回一个函数并分配给

onChange

函数

(event) => {
  this.setState({
    [name]: event.target.value
  })
}

现在，我们的情况也一样

<TextField
    ...
    value={name}
    onChange={this.handleEvent}
/>
//[name] now become yourName. It's `closure`
handleEvent = (event) => this.setState({yourName: event.target.value})

//[姓名]现在成为你的姓名。结束了`
handleEvent=（event）=>this.setState（{yourName:event.target.value}）

---

和

event

现在表示启动函数时的

TextField

。

事件处理程序调用的函数将传递一个

event

对象作为参数。想象一下由浏览器实现的

addEventListener

方法如下所示：

(event) => {
  this.setState({
    [name]: event.target.value
  })
}

something.addEventListener = (eventName, callback, useCapture) => {
  // Some code here
  // Bla bla bla
  const eventObj = {
    // Event object
  };
 callback(eventObj);
}

something.addEventListener('click', eventObject => {
  // Do something
}, false);

---

如您所见，如果使用普通函数，变量

name

将包含

事件

对象，而不是实际名称。因此，通过使用curry函数，this返回的函数将传递

事件

对象，以备使用。

事件处理程序调用的函数将传递一个

事件

对象作为参数。想象一下由浏览器实现的

addEventListener

方法如下所示：

something.addEventListener = (eventName, callback, useCapture) => {
  // Some code here
  // Bla bla bla
  const eventObj = {
    // Event object
  };
 callback(eventObj);
}

something.addEventListener('click', eventObject => {
  // Do something
}, false);

---

如您所见，如果使用普通函数，变量

name

将包含

事件

对象，而不是实际名称。因此，通过使用curry函数，this返回的函数将传递

事件

对象，以备使用。

在react中，本例中的事件是传递给处理程序事件的合成事件实例。多读一些。这允许您访问event.target属性上的值。在本例中，此处理程序事件仅使用文本字段中输入的值设置名称值的状态。希望这能把事情弄清楚

在react中，本例中的事件是传递给处理程序事件的合成事件实例。多读一些。这允许您访问event.target属性上的值。在本例中，此处理程序事件仅使用文本字段中输入的值设置名称值的状态。希望这能把事情弄清楚

当

TextField

组件调用

onChange

处理程序时，这可能有助于传递

事件。当
onChange
处理程序被
TextField
组件调用时，这可能有助于传递
事件。