我目前有一个模式弹出,希望它消失,如果用户不输入他们的密码30秒。这是可行的,但是当我试图在输入上使用onChange事件实现它时,它就停止工作了。奇怪的是,当我使用console.log测试它时,它是有效的。一旦我删除了那些console.log,它就不起作用了。只是好奇是否有人以前见过这个?
let TIMEOUT = null;
const setModalTimeout = randomFunction => {
if (TIMEOUT === null) {
// console.log('NOTE: set timeout before', TIMEOUT, new Date().toLocaleTimeString());
TIMEOUT = setTimeout(() => randomFunction(false), MODAL_TIMEOUT);
}
// console.log('NOTE: set timeout after', TIMEOUT, new Date().toLocaleTimeString());
};
const clearModalTimeout = (done) => {
if (TIMEOUT !== null) {
// console.log('NOTE: clear timeout before', TIMEOUT, new Date().toLocaleTimeString());
clearTimeout(TIMEOUT);
TIMEOUT = null;
}
// console.log('NOTE: clear timeout after', TIMEOUT, new Date().toLocaleTimeString());
done && done();
};
const resetModalTimeout = (randomFunction) => {
// console.log('NOTE: reset timeout', TIMEOUT, new Date().toLocaleTimeString());
clearModalTimeout();
setModalTimeout(randomFunction);
}上面是逻辑,下面是输入标签。
<input type="password" placeholder="pin/password" id="password" oncreate={element => element.focus()} onchange={() => resetModalTimeout(randomFunction)} />这个问题的主要部分是,如果我取消对console.log的评论,它将完美地工作。现在显示代码的方式是不工作的。它只会经历第一个周期(所以即使我更改了输入,也只能工作30秒)。当我登录时,它清楚地表明了变化是经过的。有什么想法吗?当然,我不想在主代码中使用console.log,我也使用hyperapp (现有的代码库)。在日志记录时,我可以看到TIMEOUT值按预期变化。
发布于 2019-03-15 16:44:17
我刚刚意识到问题出在哪里。随着更多的调试,我的同事和我意识到这与生命周期挂钩有关。它应该是oninput而不是onchange。在我的电脑上,onchange在登录时工作得很好(不太确定为什么有人会回答这个问题),但在我同事的电脑上就不行了。当改为oninput时,它对我们两个都很好。onchange在等待焦点离开输入。
https://stackoverflow.com/questions/55186584
复制相似问题