React JS 滑块滞后答案

【问题标题】：React JS Slider LagReact JS 滑块滞后
【发布时间】：2016-08-20 01:36:02
【问题描述】：

我们使用滑块按时间过滤。目前，当我们将它加载到手机上并使用它时，会有很大的延迟，当你滑动滑块时，它似乎在时间的物理显示上。下面是我们的代码，任何想法为什么会发生这种情况？我们是否需要更新我们计算价值的方式（我们尝试将其作为股票价值，设置状态并仍然看到滞后，所以我们不相信是这样）。目前我们正在尝试在此滑块上显示 24 小时。

谢谢！

注意：我们正在审查代码，甚至删除了函数调用中多余的 this.setState({value: this.limitMarkers(value)} 以及函数本身。这没有帮助:(。如果任何人有任何想法请告诉我们！

 <Slider
   minimumTrackTintColor={'#FFCD00'}
   maximumTrackTintColor={'#e0e0e0'}
   thumbStyle={{color: '#FFCD00', backgroundColor: '#FFCD00'}}
   value={this.state.sliderValue}
   maximumValue={this.state.maximumValue}
   step={.5}
   onValueChange={(value) => this.setState({value: this.limitMarkers(value)}) }
   onSlidingComplete={ (value)=>{ SOME CODE }></Slider>

限制标记函数

limitMarkers(i){

    var decimals = Math.round((i - Math.floor(i))*59);
    i = Math.floor(i);
    var hours = currentHour+i;
    var time;

    if(hours > 12){
      if(hours > 24){
        if(hours > 36){
            hours = hours - 36;
            time = ' PM';
            labelIsTomorrow = true;
        }
        else{
          hours = hours - 24;
          time = ' AM';
          labelIsTomorrow = true;
        }
      }
      else{
        hours = hours - 12;
        time = ' PM'
        labelIsTomorrow = false;
      }
    }
    else {
      time = ' AM'
      labelIsTomorrow = false;
    }

    if(decimals < 10) decimals='0'+decimals;

    this.setState({
      label: hours+":"+(decimals),
      TOD: time
    });

    return hours;
  }

【问题讨论】：

标签： javascript reactjs slider react-native

【解决方案1】：

代码有效，这是因为我们在调试模式下运行应用程序。一旦我们将其置于发布模式并删除调试移动，滞后就消失了。

【讨论】：