Javascript 输入值正在同步，我不希望它们同步

ChildComponent根据传入的索引显示不同的片段。这很好，但如果我在多个片段上有输入元素，并且在其中一个片段中放入一个值，它会自动复制到其他片段中。为什么会发生这种情况？我怎样才能阻止它

const { Fragment } = React;

const fragments = (onChangeHandler) =>
  [
    <input type="text" id="screen1_input1" onChange={onChangeHandler} />,
    <input type="text" id="screen2_input1" onChange={onChangeHandler} />
  ];

const ChildComponent = ({ index, fragments }) => {
    const onChange = e => {
    const { target: {id, value} } = e;
    console.log(id, value);

        const newData = {
            ...contentData,
            [e.target.id]: e.target.value
        }
        setContentData(newData)
    };

  return (
    <Fragment>
      <h2 className="screens">{fragments(onChange)[index]}</h2>
    </Fragment>
  );
};

const ParentComponent = props => {
  return <ChildComponent index={1} fragments={fragments}/>;
};

ReactDOM.render(<ParentComponent />, document.getElementById("react"));

---

为他们提供唯一的密钥，如下所示：

const fragments = (onChangeHandler) =>
  [
    <input key="key1" type="text" placeholder="input 1" id="screen1_input1" onChange={onChangeHandler} />,
    <input key="key2" type="text" placeholder="input 2" id="screen2_input1" onChange={onChangeHandler} />
  ];

下面是一个沙箱来演示它：

React使用键prop来理解组件到DOM元素的关系，然后用于协调过程。因此，密钥始终保持唯一性非常重要，否则React很有可能会混淆元素并变异不正确的元素

---

参考资料：

为他们提供唯一的密钥，如下所示：

const fragments = (onChangeHandler) =>
  [
    <input key="key1" type="text" placeholder="input 1" id="screen1_input1" onChange={onChangeHandler} />,
    <input key="key2" type="text" placeholder="input 2" id="screen2_input1" onChange={onChangeHandler} />
  ];

下面是一个沙箱来演示它：

React使用键prop来理解组件到DOM元素的关系，然后用于协调过程。因此，密钥始终保持唯一性非常重要，否则React很有可能会混淆元素并变异不正确的元素

---

参考资料：

您能为您的输入显示onChangeHandler吗？看起来两个输入都使用相同的状态tags@NearonChangeHandler只是从ChildComponent传递的onChange。@我更新了它。您能为您的输入显示onChangeHandler吗？看起来两个输入都使用相同的状态tags@NearonChangeHandler只是从ChildComponent传递的onChange。@我更新了它。这个答案没有错，但为什么为每个组件提供唯一的React键来解决问题呢@DrewReese我推迟添加该部分，因为我认为您的专利问题/解决方案答案即将发布，这将使一切变得非常清楚不，这次不是。这个答案没有错，但是为什么为每个问题提供唯一的React键可以解决问题呢@DrewReese我推迟添加该部分，因为我认为您的专利问题/解决方案答案即将发布，这将使一切变得非常清楚不，这次不行。