reactjs - 如何在 React 中沿滑块移动的 ReachUI 中放置标签

Question

我正在使用 ReachUI 范围滑块' https://reacttraining.com/reach-ui/slider '。

我使用它是因为它给了我一个选项 <SliderMarker value={50} /> 这有助于在我需要的行上放置标记。

这个库我面临的唯一问题是：我无法放置一个沿着滑块移动的值标签。即使在这方面可能，我也无法从其文档中理解它。

可以在这个库中放置标签吗？

或者是否有任何适合范围滑块的好的 React 库可以满足我的这两个要求：在滑块的某个值上标记和可移动标签。

请建议！

标签： reactjsslider

Answer 1

这很简单。reachUI 滑块的代码如下所示：

<Slider name="coldRent"                    
                min={}
                max={}
                step={}
                value={}
                onChange={}                    
              >
    <SliderTrack>
      <SliderTrackHighlight />                        
      <SliderMarker value={} />
      <SliderHandle>
         <span> </span>
      </SliderHandle>
    </SliderTrack>
</Slider>

只需添加 sliderHandle 之间的跨度就可以了。