如何将其他元素插入第三方组件？

Question

我使用名为“ slider”（rc-slider）的第三方组件。我需要在滑块（div class = "rc-slider-handle"）内添加一个附加元素。

<div class="rc-slider">
   <div class="rc-slider-rail" style="..."></div>
   <div class="rc-slider-track" style="..."></div>
   <div class="rc-slider-step"></div>
   <div role="slider" tabindex="0" ... class="rc-slider-handle" style="..."> 
       // new element should be added here
   </div>
   <div class="rc-slider-mark"></div>
</div>

使用我的react组件：

    <Slider
      min={...}
      max={...}
      value={...}
      onChange={...}
    />

Answer 1

根据rc-slider docs，您可以通过handle道具：

<Slider
  min={...}
  max={...}
  value={...}
  onChange={...}
  handle={() => <div className="rc-slider-handle" />}
/>