Can Reactjs programmatically handle :before?

Question

I somehow have to programmatically set the width of the :before for a div.

 &l         


        
      

Answer 1

Yes, you can programmatically change the value of pseudo-elements like ::before, ::after in react.

Here is a trick.

app.js

const widthVar = 34;
const someStyle = {
     "--width": widthVar
}
 

style.css

.something:before{
      width: var(--width),
      // remaining code
}