我的代码如下所示，您可以看到它在https://codepen.io/rongeegee/pen/BaVJjGO中是如何工作的：

const { useState } = React;

const Counter = () => {
  const [data, setData] = useState({
    displayData: "data_one",
    data_one: {
      text: ""
    },
    data_two:{
      text:""
    }
  })
  
  function handleOnChange(event){
    event.preventDefault();
    const new_data = {...data};
    if (event.target.name == "displayData"){
      new_data.displayData = event.target.value;
      setData(new_data);
    }
    else{
      new_data[event.target.name]["text"] = event.target.value;]
      setData(new_data);
    }
  }

  return (
    <div>
      <form onChange={handleOnChange}>
        <select name="displayData" value={data.displayData}>
          <option value="data_one">data_one</option>
          <option value="data_two">data_two</option>
        </select>
        <br/>
        {
          data.displayData == "data_one" 
            ?
            <>data One: <input name="data_one" defaultValue={data.data_one.text} /></> 
            :
            <>data two: <input name="data_two" defaultValue={data.data_two.text} /></>
        }
      </form>
    </div>
  )
}

ReactDOM.render(<Counter />, document.getElementById('app'))

如果我在data_one的输入中键入一些内容，在“data_one”和“data_two”之间切换值，data_two输入字段将具有相同的值。如果我更改data_one中的值，将下拉列表切换到“data_one”，data_one将再次具有相同的值。
这不应该发生，因为data_one input使用data state中data_one字段的文本字段的值，而data_two input使用data_two字段的文本字段的值。不应该从state中的另一个字段获取值。