Question

我们正在使用滑块按时间过滤。目前，当我们将它加载到手机并使用它时，存在很多延迟，当滑动滑块时，它似乎在物理显示时间。以下是我们的代码，为什么会发生这种情况的任何想法？我们是否需要更新我们如何计算价值（我们将其作为股票价值，设置状态并仍然看到滞后因此我们不相信它就是这样）。目前我们正在尝试在此滑块上显示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;
  }

Answer 1

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

React JS Slider Lag

1 个答案: