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

编程问答 2022-06-04

问题描述

就这样：

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)
 }}
/>

它将更改所有项目的值。但是我想独立更改元素的值。

解决方法

尝试这种方式

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)
  }}
 />

)}
decrementinputinputjavascripttypescripttypescripttypescript