CODEWITHSUNDEEP
reactjs
angry
angry

Reputation: 421

How to insert additional element to third-party component?

I use the third-party component named "slider" (rc-slider). I need to add an additional element inside the slider 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>

Using from my react component:

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

Upvotes: 0

Views: 175

Answers (1)

n1stre
n1stre

Reputation: 6086

According to rc-slider docs, you're able to pass a handle prop:

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

Upvotes: 1

Related Questions