How can we dynamically change the properties of a CSS Class in ReactJS. For example, I have several text fields with CSS Classname "important". I want to change all of them to have flash a red background on click of a button.
I thought I could do this by changing the properties of that CSS Class. How do I alter this class so that all its the text fields with that class will change in a flash.
Or is there another more elegant way of doing this?
In your render() method, use a state variable to attach different classes to the rendered element depending on its state.
You can do something like conditionally passing classes in your className={""} prop.
If state changes class name will be changed also.
It will look something like this:
className={state ? "important" : "yourDesiredClass"}