Question

我们有一个具有昼夜模式的应用程序。在模式之间切换是一个简单的布尔开关。我们想要做的是让模式在白天从白天到晚上自动切换。

当前，此切换发生在我们的根容器的componentWillReceiveProps中。我不喜欢这种方法，因为它只会在渲染发生时触发。我的想法是建立一个简单的循环interval每隔几分钟左右检查一次当前时间，但是我们已经在React Native应用中运行了几个时间间隔，我不确定性能如何提高，正在进行的民意调查将会如此。

在这里使用间隔是否合适，或者有更好的时间跟踪方法？

Answer 1

即使应用程序处于后台，您也可以使用react-native-background-timer定期发出事件。

const getCurrentMode = () => {
    let mode
    const afternoon = 12
    const evening = 17
    const currentHour = moment().format("HH")

    if(currentHour >= afternoon && currentHour <= evening) {
        mode = "afternoon";
    } else if(currentHour >= evening) {
        mode = "evening";
    } else {
        mode = "morning";
    }
    return mode
}

import BackgroundTimer from 'react-native-background-timer';
import moment from 'moment'

componentDidMount() {
  BackgroundTimer.setInterval(() => {
    const currentMode = getCurrentMode()
    if(currentMode !== this.state.currentMode) {
       this.setState({currentMode})
    }
  }, 200); // ... Set the delay here in ms
}

componentWillUnmount() {
  BackgroundTimer.clearInterval(intervalId);
}

Answer 2

您无需担心设置计时器对性能的影响。我不确定RN，但是在浏览器中，通常Javascript计时总是有其自己的线程。

您需要担心的是，不要将时间间隔设置得太短（因为定时器将调用的时间本身就是同步的），也不应该像Android长定时器keep the Timing module awake那样设置得太长（> 1分钟）。最重要的是，您需要确保在卸载时清除计时器-请参见https://facebook.github.io/react-native/docs/timers。

在React Native应用中在日落时更新主题

2 个答案: