首页 > 解决方案 > React 中的条件状态

问题描述

假设我有这些初始状态

this.state = {schedules: [], status: 'morning'}

以及从 API 中获取的动态计划 JSON 的对象,该 API 可能会在某一天发生变化。例如

schedules = {"morning": "6:30", "midday": "13:00", "afternoon":"17:30", "night":"21:00"}

现在我如何this.state.status分别改变当前的时差?例如curTime = '14:30',所以this.state.status = 'midday'

这样做的目的是为每个调度组件设置不同的样式(基于this.state.status),例如 style={{color: this.state.status == 'morning' ? 'red' : 'black'}}

标签: javascriptarraysjsonreactjsreact-native

解决方案


与此类似的功能应该可以工作

updateStatus(){
   const keys = Object.keys(this.state.schedules).reverse();
   for(i = 0; i < keys.length; i++) {
       if(curTime > this.state.schedules[keys[i]]) {
           this.setState({status:keys[i]});
           break;
       }
   }
}

您唯一需要考虑的是如何比较时间。


推荐阅读