我在试着组装一个简单的计数器来改变物品的数量.使用挂钩管理其状态,我可以正确更新屏幕上的值.但是,当i控制台日志(log)时,状态保持的值总是比屏幕上的值小一个.
例如:
如果起始值为1,按下加号按钮后,屏幕上的值变为2,但在控制台中,状态值仍为1.
Setup of Hooks and functions controlling the count:
//Set Quantity
const [quantity, setQuantity] = useState(1);
//Set Item price
const [itemPrice, setItemPrice] = useState(itemOptions[0].price)
//Counter Control
const [disableMinus, setDisableMinus] = useState(true);
const addQuantity = () => {
if (quantity === 1) {
setQuantity(quantity + 1);
setDisableMinus(false);
console.log(quantity)
} else {
if (quantity > 1){
setQuantity(quantity + 1);
setDisableMinus(false);
console.log(quantity)
}
}
}
const minusQuantity = () => {
if (quantity === 1){
setDisableMinus(true);
} else {
if (quantity > 1) {
setQuantity(quantity - 1);
setDisableMinus(false);
console.log(quantity)
}
}
}
return (
<View style={{flexDirection: 'row', alignItems: 'center', justifyContent: "center", paddingVertical: 20}}>
<TouchableOpacity disabled={disableMinus} onPress={() => minusQuantity()}>
<AntDesign style={{color: '#37BD6B'}} name="minuscircle" size={30}/>
</TouchableOpacity>
<Text style={{paddingHorizontal: 10, fontWeight: '700', fontSize: 30}}>{quantity}</Text>
<TouchableOpacity onPress={() => addQuantity()}>
<AntDesign style={{color: '#37BD6B'}} name="pluscircle" size={30}/>
</TouchableOpacity>
)
提前感谢