Javascript 如何转换<；任何>；handleChange函数从类到函数组件

我正在尝试将现有的react类转换为功能组件。我知道函数使用的是

useState（）

函数，而不是类中的

setState（）

。我将如何将处理任何输入更改的这段代码转换为功能代码

handleChange = (input) => (e) => {
    this.setState({ [input]: e.target.value });
  };

---

您可以为每个字段使用不同的

useState

hook，但不必这样做。通过使用单个

state

对象来保存所有字段，可以使设置与类组件中的设置几乎相同。主要区别在于使用

useState

必须提供整个状态，因此需要使用

…state

来包含未更改的属性

const Form = () => {
  const [state, setState] = React.useState({
    first: "",
    last: "",
    address: ""
  });

  const handleChange = (input: keyof typeof state) => 
    (e: React.ChangeEvent<HTMLInputElement>) => {
      setState({
        ...state,
        [input]: e.target.value
      });
    };

  return (
    <form>
      <input value={state.first} onChange={handleChange("first")} />
      <input value={state.last} onChange={handleChange("last")} />
      <input value={state.address} onChange={handleChange("address")} />
    </form>
  );
};

const Form=（）=>{
常量[状态，设置状态]=React.useState({
首先：“，
最后:，
地址：“
});
const handleChange=（输入：keyof typeof state）=>
（e:React.ChangeEvent）=>{
设定状态({
……国家，
[输入]：e.target.value
});
};
返回(
);
};

功能部件也使用设置状态。。它使用如下内容：const[x，setX]=useState（0）；其中0是的初始值x@GlenK我明白了，但是如何使它动态地处理多个不同的输入而不必显式地创建这样的变量呢？通常我为每个变量创建一个常量。。如果我有名字，地址，电话。。我将有const[name，setName]，const[address，setAddress]，const[phone，setPhone]