Reputation:
I have something like this:
redTimeout = () => {
setTimeout(() => {
this.props.redBoxScore();
this.setState({
overlayContainer: 'none'
});
}, 5000);
}
And I have a method runs when a button is clicked:
handleTerminate = () => {
}
How can I stop the setTimeout
in the another function when the button is clicked?
Upvotes: 0
Views: 347
Reputation: 370779
Put the timeout ID returned by setTimeout
into state or a ref or something so that you can reference it in the other function:
redTimeout = () => {
const timeoutId = setTimeout(() => {
this.props.redBoxScore();
this.setState({
overlayContainer: 'none'
});
}, 5000);
this.setState({ timeoutId });
}
handleTerminate = () => {
clearTimeout(this.state.timeoutId);
}
Upvotes: 2