如何增加或减少数组的多个输入的值？

Question

就是这样：

const [count, setCount] = useState(1 as any)

{items.map((item: any) => (...

然后将数组中的项目映射到购物车中。我希望能够增加或减少数量。

<input
 type="number"
 min="1"
 value={count}
 onChange={(event): any => {
 setCount(event.target.value)
 }}
/>

它改变了所有项目的价值。但我想独立改变元素的值。

Answer 1

试试这个方法

const [items, setItems] = useState(items); // items array []

const onTextChanged = (index, value) => {
    const items = [...items]; 
    items[index].count = value; <-- "count" is example key for showing way out of this -->
    setItems(items);
}

{items.map((item, index) => (

 <input
  type="number"
  min="1"
  value={item.count || 0}
  onChange={(event): any => {
    onTextChanged(index, event.target.value)
  }}
 />

)}