我有 2 個函式，onTouchStart 和 onTouchEnd，其中 onTouchEnd 使用 onTouchStart 設定的狀態變數。我擔心 onTouchEnd 函式可能會讀取狀態變數的錯誤值，因為 onTouchStart 可能還沒有完成狀態設定。主要問題是我不希望 onTouchEnd 在每次 onTouchStart 完成時都被觸發，而是需要 onTouchStart 在 onTouchEnd 執行之前將狀態存盤的變數設定為正確的值。
onTouchStart(){
this.setState({
randomBool: true
});
}
onTouchEnd(){
console.log("randomBool should be true: " this.state.randomBool);
//then some stuff here
}
uj5u.com熱心網友回復：
您可以使用檢查后跟setTimeout：
onTouchEnd(){
if (!this.state.randomBool)
setTimeout(this.onTouchEnd, 10);
//then some stuff here
}
如果需要，您還可以將引數傳遞給“遞回”呼叫： setTimeout(() => this.onTouchEnd(v1, v2), 10);
uj5u.com熱心網友回復：
為了確定地執行此操作，您需要一些可以同步寫入的狀態，并且您需要一些東西來指示 setState 已完成。
（我在這里假設 setState 以承諾的形式提供此指示）。
在下面的代碼段中，按住滑鼠不到一秒鐘，然后再試一秒鐘以上...
document.getElementById("touchMe").addEventListener('mousedown', onTouchStart);
document.getElementById("touchMe").addEventListener('mouseup', onTouchEnd);
let state; // assuming we can only read and write this async...
// ...with this getter and setter
async function setState(object) {
return new Promise(resolve => {
setTimeout(() => {
state = object
resolve()
}, 1000);
})
}
async function getState() {
return new Promise(resolve => {
setTimeout(() => {
resolve(state)
}, 1000);
})
}
// BUT, we can write this synchronously
let settingState = false;
function onTouchStart() {
settingState = true;
setState({ someBool: true }).then(() => {
settingState = false;
})
}
function onTouchEnd() {
if (settingState) {
console.log("giving up, because we're busy writing state");
return;
}
console.log("we can get state now");
getState().then(state => console.log(state));
}<div id="touchMe" style="background-color:yellow;">Touch Me</div>轉載請註明出處，本文鏈接：https://www.uj5u.com/shujuku/410584.html
標籤：