javascript - React JS slider 滞后

Question

我们使用 slider 按时间过滤。目前，当我们将它加载到手机上并使用它时，会出现很多延迟，而且当您滑动 slider 时，它似乎在时间的物理显示上。下面是我们的代码，为什么会发生这种情况？我们是否需要更新我们计算值(value)的方式(我们尝试将其作为股票值(value)，设置状态并仍然看到滞后，所以我们不相信它是那样)。目前我们正在尝试在此 slider 上显示 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

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