我有一個接受數字的輸入欄位，我想通過鍵盤輸入以及按鈕來更改值。
只要我不使用鍵盤輸入，這些按鈕就可以正常作業。例如，如果我輸入 10 并使用按鈕添加 1，則值會更改為 101 而不是我預期的 11。另一方面，當我使用按鈕減小值時，它再次正常作業。
我怎樣才能讓它正常作業？我會很感激你的幫助...
const [maxAmount, setMaxAmount] = useState(0);
const decrementMaxAmount = () => {
if (maxAmount > 0) setMaxAmount(maxAmount - 1);
};
const incrementMaxAmount = () => {
setMaxAmount(maxAmount 1);
};
<button onClick={() => decrementMaxAmount()}>
<button onClick={() => incrementMaxAmount()}>
<input
type="number"
name="maxAmount"
value={maxAmount}
onChange={(event) => setMaxAmount(event.target.value)}
/>
uj5u.com熱心網友回復：
event.target.value 的型別是字串。所以你的 maxAmount 是一個字串 :
maxAmount 1 === "10" 1 === "101"。
為避免這種情況，您可以使用 Number() 建構式轉換您的型別：
setMaxAmount(Number(event.target.value))
uj5u.com熱心網友回復：
event.target.value回傳一個字串值，所以你需要決議它。所以：
event.target.value要么parseInt(event.target.value)
uj5u.com熱心網友回復：
發生這種情況是因為event.target.value是一個字串’10’并且在 JavaScript 中’10’ 1 = ‘101’。要獲得預期的結果，您應該event.target.value在分配之前將其轉換為整數。
onChange={(event) => setMaxAmount(parseInt(event.target.value))}
僅告訴瀏覽器type=“number”如何顯示輸入欄位，而不是如何存盤值。
轉載請註明出處，本文鏈接：https://www.uj5u.com/gongcheng/457426.html
標籤：javascript 反应