【问题标题】:How to update React states with one function? [duplicate]如何用一个函数更新 React 状态? [复制]
【发布时间】:2020-04-22 08:50:34
【问题描述】:

请看下图。

有没有一种方法可以创建一个函数来更新状态,而无需创建三个单独的函数。我希望函数使用 ref 的名称或类名来更新相应的状态及其值。

【问题讨论】:

  • 是的!谢谢!

标签: javascript reactjs react-native


【解决方案1】:

例如,如果它是一个表单组件,那么:

const Form = () => {
  const [form, setForm] = React.useState({});
  const handleChange = e => {
  const {name, value} = e.target;
  setForm(prevState => ({...prevState, [name]: value})); 
  }
  return(
  <form>
     <Input
      name="input1"
      value={form.input1}
      onChange={handleChange}
      />
      <Input
      name="input2"
      value={form.input2}
      onChange={handleChange}
      />
      // etc...
  )
}

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 2020-11-08
    • 2021-01-24
    • 1970-01-01
    • 2016-05-12
    • 2021-02-06
    • 2017-01-19
    • 1970-01-01
    • 2020-07-31
    相关资源
    最近更新 更多