React Native timemixin取消计时器超时

时间:2016-03-06 05:57:19

标签: javascript ios react-native settimeout mixins

我发现了如何取消Javascript的超时但是如何取消定时器mixin?建议Timermixin在Javascript超时时与React Native一起使用。

var TimerMixin = require('react-timer-mixin');

this.setTimeout(() => {this.setState({results: ' '})}, 1800)

如果执行其他操作,我需要取消它。

1 个答案:

答案 0 :(得分:5)

<强>解决方案

var clearId = this.setTimeout(() => {this.setState({results: ' '})}, 1800);
this.setState({ clearId: clearId});

...稍后当您想要取消setTimeout调用时

this.clearTimeout(this.state.clearId)  

<强>解释

您可以使用 clearTimeout 以与常规setTimeout相同的方式取消它。如果尚未调用函数,clearTimeout将阻止该函数运行。

当调用setTimeout时,它“返回一个表示设置的计时器ID值的数字。使用此值和clearTimeout()方法取消计时器。”{{3} }

由于我想你想要在一个单独的函数中调用clearTimeout,你可以将clearId存储为一个状态属性,以便以后可以在一个单独的函数中轻松引用它。

如果想要了解有关React Native中Timers的更多信息,我发现此文档很有用http://www.w3schools.com/jsref/met_win_settimeout.asp

同时

通过使用TimerMixin(而不是常规的setTimeout方法),如果组件卸载,将自动阻止setTimeout调用。很有用!这就是为什么你应该确保使用TimerMixin而不是常规的Timer方法。

“我们发现使用React Native创建的应用程序中导致致命的主要原因是由于计时器在卸载组件后触发。” https://facebook.github.io/react-native/docs/timers.html

TimerMixin将避免这种情况,并确保在卸载组件时清除所有Timer调用。