onClick2 使狀態接收更改的值。
但是，onClick3 只希望在按下 onClick2 時傳遞更改后的狀態值。
如何控制輸入的更改值？
當輸入值更改為 456 時按下 onClick3 是否可以獲取 onChange 的先前值？
我的代碼...
import React, { useRef, useState } from "react";
const App = () => {
const [value, setValue] = useState("123");
const onChangeInput = (e) => {
setValue(e.target.value);
};
const onClick2 = () => {
console.log(value);
};
const onClick3 = () => {
// how to onclick2 preve
console.log(value);
};
return (
<div>
<input type="text" onChange={onChangeInput} value={value} />
<button onClick={onClick2}>Button1</button>
<button onClick={onClick3}>Button2</button>
</div>
);
};
export default App;
uj5u.com熱心網友回復：
您應該像這樣使用 2 個 useState，一個用于 prevValue，一個用于 currentValue -
const [value, setValue] = useState("123")
const [prevValue, setPrevValue] = useState(value)
const onChangeInput = (e) => {
setValue(e.target.value);
}
const onClick2 = () => {
setPrevValue(value)
}
const onClick3 = () => {
console.log('Previous : ', prevValue)
console.log('Current : ', value)
}
當您單擊 onClick2 btn 時，它將更新先前的值，當您單擊 onClick3 btn 時，它將為您提供先前和更新后的值的輸出。
# If your current value is 456
output:
Previous : 123
Current : 456
只需添加此代碼，您就會得到答案。
轉載請註明出處，本文鏈接：https://www.uj5u.com/ruanti/403140.html
標籤：