在单击 ReactJS 时添加输入

Question

我有一个问题，当我单击一个按钮添加一个新的多行输入时，所有输入中都记录了数据！你能帮我吗？我已经解决这个问题好几天了，我无法解决，谢谢

    {inputs.map((inputValue, index) => <>
     <Number key={"addQ" + index}
             type="input"
             placeholder="3"
             name="quantiteTab[]"
             label="Quantité*"
             classField="col-lg-2"
             onChange={(value) => setInputs(inputs => {
                 let copy = [...inputs];
                 copy[index] = value.target.value;
                 return copy;
            })}
            value={inputValue}/>
            <Number key={"addP" + index}
                    type="input"
                    placeholder="206"
                    name="poidsTab[]"
                    label="Poids total (kg)"
                    classField="col-lg-3"
                    onChange={(value) => setInputs(inputs => {
                      let copy = [...inputs];
                      copy[index] = value.target.value;
                          return copy;
                   })}
           value={inputValue}/>
   <button className="button add-line" type="button" onClick={() => setInputs(inp => [...inp,''])}>Add</button>

Answer 1

<Number key={"addQ" + index} - 键不应依赖于数组索引。从inputValue 随机生成一个密钥或传递一些不变但唯一的内容。