使用Reactjs处理地图中的输入框[关闭]

Question

<input
  type="text"
  id={`order_${i}`}
  name={`order_${i}`}
  style={{
    width: "50px",
    borderRadius: "100px",
    border: "none",
    textAlign: "center",
    background: "#d7eefc",
  }}
  value={sortOrder || folder.sort_order}
  onChange={(e) => setSortOrder(e.target.value)}
/>;

如果我更改输入框的任何一个值，那么它会更新地图中的所有输入框值

Answer 1

根据不完整的代码做出一些假设：

由于使用了

id={`order_${i}`}

属性，我假设此输入可能是循环的一部分。因此，这里的问题可能是相同的值

sortOrder || folder.sort_order

传递给循环中的所有输入。因此，当更新该值时，它可能会在所有输入中更新。在这种情况下，您将需要使用类似的值数组

value={sortOrder[i]}

并且在设置值时

onChange={(e) => { 
  sortOrder[i] = e.target.value; 
  setSortOrder(...sortOrder); 
}}