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

Question

我正在制作一个应用程序。这个想法是根据您点击的内容将状态设置为不同的东西。在这种情况下，状态是图像 src 变量。我目前有这个...

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

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

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

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

以及其他一些状态设置函数。我怎样才能将它们写成一个函数，并一遍又一遍地调用同一个函数？

Answer 1

创建单个函数，传参设置为imgPath.

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

Answer 2

您可以创建一个接受 name 和 value 的 updateState 函数，或者为您更新 imgPath 的函数。

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

或

updateImgPath = value => {
    this.setState({
        imgPath: value
    });
}
merryWeahter = () => {
    this.updateImgPath(merrys);
}
maxJPegasus = () => {
    this.updateImgPath(pega);
}

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

With React, how can I reuse the setState function instead of copying and pasting?

javascript

state

setstate

reactjs