Material ui TextField在React中不可编辑

Question

TextField不工作，我想增加和减少文本字段的增量和递减值，当我点击addToCart按钮，我想要的文本字段输入值以及项目(对象)addToCart按钮

value和defualtValue道具不工作

<Button  onClick={() => decrement(items.id)}>Decrement</Button>
<TextField value={items.quantity}/> 
<Button  onClick={() => decrement(items.id)}>Increment</Button>
<Button  onClick={() => addTocart(items)}>Add to cart</Button>

items has item{ id: 4, productname: 'Grapes', price: 100, quantity: 1 }

const addToCart = (newItem) => {
want input value and  item object
}

Answer 1

请使用此代码。

const [items, setItems] = React.useState({id:4, productname:'Grapes', price:100, quantity:1});
...
<Button  onClick={()=>setItems({...items, quantity: items.quantity - 1})} > Decrement</Button>
<TextField value={items.quantity}/> 
<Button  onClick={()=>setItems({...items, quantity: items.quantity + 1})} > Increment</Button>