Redux形式的滑塊無法平滑滑動

Question

我正在使用redux形式的滑塊。 我在窗體中獲得了滑塊的值，但是問題是，滑塊無法平滑滑動。 它根據提到的“步驟”滑動。 我該如何解決？

import Slider from "rc-slider";

<Field
  name="Term"                 
  component={(props,input, onChange, onAfterChange) => 
    <Slider 
      value= {props.input.value}
      onChange={props.input.onChange}
      {...props}

      dots
      step={12}
      max={48}

      className="common-slider-style"
      trackStyle={{ backgroundColor: "#00599a" }}
      handleStyle={{
        border: "1px solid #00599a",
        width: "20px",
        height: "20px",
        top: "1px"
      }}
      activeDotStyle={{
        border: "1px solid #00599a",
        width: "10px",
        height: "10px"
      }}

      marks={marks}
      onAfterChange={this.onAfterChange.bind(this)}  
    />
  }  

Answer 1

當您指定step={12} ，滑塊將一次移動12步。 這就是為什么它跳躍而不是平穩滑動的原因。 如果您希望它更順滑地滑動，請在step減小該值。

根據您使用的組件的文檔 ，該值必須大於0，並且max和min之間的差必須可以被step均勻除盡。