我正在升级一些旧的TypeScript代码以使用最新的编译器版本，我在调用setTimeout时有麻烦。代码期望调用浏览器的setTimeout函数，该函数返回一个数字:
setTimeout(处理程序:(…Args: any[]) => void, timeout: number): number;
但是，编译器将此解析为节点实现，该实现将返回NodeJS。定时器:
setTimeout(回调:(…Args: any[]) => void, ms: number，…args: any[]): NodeJS.Timer;
这段代码没有在节点中运行，但是节点类型被拉入作为对其他东西的依赖(不确定是什么)。
如何指示编译器选择我想要的setTimeout版本?
下面是问题代码:
let n: number;
n = setTimeout(function () { /* snip */ }, 500);
这将产生编译器错误:TS2322:类型'Timer'不能分配给类型'number'。
当前回答
我遇到了同样的问题，我们的团队决定使用的解决方法是使用“any”作为计时器类型。例如:
let n: any;
n = setTimeout(function () { /* snip */ }, 500);
它将与setTimeout/setInterval/clearTimeout/clearInterval方法的两种实现一起工作。
其他回答
我遇到了同样的问题，我们的团队决定使用的解决方法是使用“any”作为计时器类型。例如:
let n: any;
n = setTimeout(function () { /* snip */ }, 500);
它将与setTimeout/setInterval/clearTimeout/clearInterval方法的两种实现一起工作。
我想这取决于您将在哪里运行代码。
如果你的运行时目标是服务器端Node JS，使用:
let timeout: NodeJS.Timeout;
global.clearTimeout(timeout);
如果你的运行时目标是浏览器，使用:
let timeout: number;
window.clearTimeout(timeout);
如果你的目标是setInterval。那么你也可以写成
let timerId: number = setInterval((()=>{
this.populateGrid(true)
}) as TimerHandler, 5*1000)
}
我正在使用RTL测试我的Counter应用程序，特别是在测试一个元素，如果计数达到15就要删除。由于组件在运行测试后被销毁，setTimeout仍然会在此之后运行，并抛出一个错误，说React不能对卸载的组件执行状态更新。因此，基于dhilt的回答，我能够以这种方式修复我的useEffect清理函数:
const [count, setCount] = useState(initialCount);
const [bigSize, setBigSize] = useState(initialCount >= 15);
useEffect(() => {
let id: NodeJS.Timeout;
if(count >= 15) {
id = setTimeout(() => setBigSize(true), 300);
}
return function cleanup() {
clearTimeout(id);
}
});
这是测试套件:
describe('when the incrementor changes to 5 and "add" button is clicked', () => {
beforeEach(async () => {
userEvent.type(screen.getByLabelText(/Incrementor/), '{selectall}5');
userEvent.click(screen.getByRole('button', {name: "Add to Counter"}));
await screen.findByText('Current Count: 15');
})
it('renders Current Count: 15', () => {
expect(screen.getByText('Current Count: 15')).toBeInTheDocument();
});
it('renders too big and will dissapear after 300ms',async() => {
await waitForElementToBeRemoved(() => screen.queryByText(/size: small/i))
});
})
这对我来说非常有效。
type Timer = ReturnType<typeof setTimeout>
const timer: Timer = setTimeout(() => {}, 1000)
