Javascript 使用React，我如何重用setState函数而不是复制和粘贴？

我正在制作一个应用程序。其思想是，根据单击的内容将状态设置为不同的内容。在本例中，状态是image src变量。我现在有这个

   merryWeather = () => {
      this.setState({
         imgPath: merrys
      })
   }

   maxJPegasus = () => {
      this.setState({
         imgPath: pega
      })
   }

   betterCallLamar = () => {
      this.setState({
         imgPath: lamars
      })
   }

   betterCallLester = () => {
      this.setState({
         imgPath: lesters
      })
   }

---

以及其他一些状态设置功能。如何将这些函数编写为一个函数，并反复调用同一个函数？

创建一个函数，并传递要设置为

imgPath

的参数

setImgPath = (imgPath) => {
  this.setState({imgPath});
}

---

创建单个函数并传递要设置为

imgPath

的参数

setImgPath = (imgPath) => {
  this.setState({imgPath});
}

---

您可以创建一个

updateState

函数，该函数接受

name

和

value

或一个更新

imgPath

的函数

updateState = (name, value) => {
    this.setState({
        [name]: value
    });
}
merryWeahter = () => {
    this.updateState('imgPath', merrys);
}
maxJPegasus = () => {
    this.updateState('imgPath', pega);
}

或

---

您可以创建一个

updateState

函数，该函数接受

name

和

value

或一个更新

imgPath

的函数

updateState = (name, value) => {
    this.setState({
        [name]: value
    });
}
merryWeahter = () => {
    this.updateState('imgPath', merrys);
}
maxJPegasus = () => {
    this.updateState('imgPath', pega);
}

或

---

只需创建一个函数并将值作为参数传递，如

merrys，pega

。只需创建一个函数并将值作为参数传递，如

merrys，pega

。您好，现在的问题是，当我使用onClick={this.setImgPath（lamars）}调用函数时，它会立即加载图像，如果您无法从组件中获取要传入的值，则可以使用类似lodash的分部函数的方法，使用自动传入的值创建新函数。例如：onClick={partial（this.setImgPath，merrys）}@Matiny，尽管这是一个很好的迹象，您需要将它们分解为各自的组件，并将setImgPath和imageUrl作为props@Matiny如果您想在单击时传递参数，您应该执行

onClick={（）=>this.setImagePath（lamars）}

括号在javascript中表示执行，您需要将函数作为参数传递。您好，现在的问题是，当我使用onClick={this.setImgPath（lamars）}调用函数时，它会立即加载图像，而不是onClick如果您无法从要传递的组件中获取值，您可以使用lodash的分部函数之类的东西来创建具有自动传入的值的新函数。例如：onClick={partial（this.setImgPath，merrys）}@Matiny，尽管这是一个很好的迹象，您需要将它们分解为各自的组件，并将setImgPath和imageUrl作为props@Matiny如果您想在单击时传递参数，您应该执行

onClick={（）=>this.setImagePath（lamars）}

括号在javascript中表示执行，您需要将函数作为参数传递。您好，我遇到了与上述响应程序相同的问题。当我这样设置时，图像会立即加载，而不是一次单击。默认情况下，我调用的函数没有括号，因此目前无法立即加载。@Matiny您可以使用

.bind（）

将参数传递给函数

onClick={this.updateigpath.bind（this，merrys）

Hello，我遇到了与上面的响应程序相同的问题。当我这样设置时，图像会立即加载，而不是onClick。默认情况下，我调用的函数没有括号，所以目前我不会立即加载。@matny您可以使用

.bind（）

将参数传递给函数。

onClick={this.updateigpath.bind（this，merrys）