反应本机间隔,无法使其正确
React native interval, Can't make it right way
您好,我正在尝试使用 interval.I 设置一个组件,将间隔代码放入 componentdidmount
并在 componentWillUnmount
中清除它。
当用户浏览另一个屏幕但控制台日志显示它继续时,它应该停止间隔。
我也想每 1 秒工作一次,但是当我将间隔时间设置为 1000
时,它会在 3 秒后工作
constructor(props) {
super(props);
this.state = {
text:'',
};
this._interval = null;
}
componentDidMount() {
if (!this._interval) {
console.log('this._interval',this._interval)
var endNew = new Date(this.props.end);
var distance = endNew.getTime() - newNow.getTime();
var hour = Math.floor(distance / 1000 / 60 / 60);
var minutes = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60));
var seconds = Math.floor((distance % (1000 * 60)) / 1000);
if (hour < 1 && minutes < 1 && seconds < 2) {
this.setState({isClosed: false});
} else {
this.setState({
textt: hour + ' h ' + minutes + ' m ' + seconds + 's',
});
}
}, 1000);
}
}
componentWillUnmount() {
clearInterval(this._interval);
clearTimeout(this._interval);
}
if (!this._interval) {
console.log('this._interval',this._interval)
和console log = this._interval null
如果您使用的是 react-navigation,stacknavigator 在将新视图推到顶部时不会调用componentdidmount
。
如您在 docs 中所见,您应该订阅 focus/blur。
您好,我正在尝试使用 interval.I 设置一个组件,将间隔代码放入 componentdidmount
并在 componentWillUnmount
中清除它。
当用户浏览另一个屏幕但控制台日志显示它继续时,它应该停止间隔。
我也想每 1 秒工作一次,但是当我将间隔时间设置为 1000
时,它会在 3 秒后工作
constructor(props) {
super(props);
this.state = {
text:'',
};
this._interval = null;
}
componentDidMount() {
if (!this._interval) {
console.log('this._interval',this._interval)
var endNew = new Date(this.props.end);
var distance = endNew.getTime() - newNow.getTime();
var hour = Math.floor(distance / 1000 / 60 / 60);
var minutes = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60));
var seconds = Math.floor((distance % (1000 * 60)) / 1000);
if (hour < 1 && minutes < 1 && seconds < 2) {
this.setState({isClosed: false});
} else {
this.setState({
textt: hour + ' h ' + minutes + ' m ' + seconds + 's',
});
}
}, 1000);
}
}
componentWillUnmount() {
clearInterval(this._interval);
clearTimeout(this._interval);
}
if (!this._interval) {
console.log('this._interval',this._interval)
和console log = this._interval null
如果您使用的是 react-navigation,stacknavigator 在将新视图推到顶部时不会调用componentdidmount
。
如您在 docs 中所见,您应该订阅 focus/blur。