平均值和中值計算器接受三個輸入值并將平均值和中值回傳給用戶。中位數正在回傳預期結果,所以我沒有在下面包含它。問題是平均值很差。
我已經控制臺記錄了這些數字,以確保在執行計算之前它們沒有被操縱,而事實并非如此。我已經 console.log 將在 console.log 的輸入中輸入的數字進行并排比較,例如
console.log((34 30 11)/ 3) //return 25
以上回傳正確,但輸入欄位中輸入的值回傳 114337。
console.log((inputValue.val1 inputValue.val2 inputValue.val3) / 3) //return 114337 which is wrong
我已經多次查看我的代碼并沒有看到任何東西,所以我決定在這里發布以獲得額外的眼睛,希望找到解決方案。
const [min] = useState(0);
const [CalcAvg, setCalcAvg] = useState(0);
const [inputValue, setInputValue] = useState({
val1: 0,
val2: 0,
val3: 0,
});
const handleChange = event => {
const {name, value} = event.target;
setInputValue(prev => {
return {
...prev,
[name]: value
}
})
}
const average = () => {
// console.log("val1 " inputValue.val1)
// console.log("val2 " inputValue.val2);
// console.log("val3 " inputValue.val3);
/*** THE ISSUE IS HERE ****/
console.log((inputValue.val1 inputValue.val2 inputValue.val3) / 3);
// setCalcAvg(avg);
}
const handleSubmit = event => {
event.preventDefault()
average()
median()
/*** THIS RETURNS THE CORRECT VALUE ****/
console.log((34 30 11) / 3);
}
return (
<main>
<div>
<form onSubmit={handleSubmit} className="form">
<input
name="val1"
value={inputValue.val1}
type="number"
min={min}
onChange={handleChange}
required
/>
<input
name="val2"
value={inputValue.val2}
type="number"
min={min}
onChange={handleChange}
required
/>
<input
name="val3"
value={inputValue.val3}
type="number"
min={min}
onChange={handleChange}
required
/>
<button onSubmit={handleSubmit} type="submit">
Calculate
</button>
</form>
<Results average={CalcAvg} />
</div>
</main>
);```
uj5u.com熱心網友回復:
它將您的值視為字串而不是整數。因此,它得到正確的回應,因為它分裂343011的3。如果您使用parseInt(inputValue.val1, 10)將這些字串強制轉換為整數,您將得到預期的結果25。由于您沒有發布您的中值函式,我無法告訴您為什么它有效,而這不是。
您還可以應用parseInt在handleChange使用功能
[name]: parseInt(value, 10)
console.log(('34' '30' '11')/3)
console.log((parseInt('34', 10) parseInt('30', 10) parseInt('11', 10))/3)
轉載請註明出處,本文鏈接:https://www.uj5u.com/caozuo/405637.html
標籤:
下一篇:將多個python字串轉換為物件
