ReactJS - Change CSS Class Properties-CodePudding

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?

CodePudding user response：

In your render() method, use a state variable to attach different classes to the rendered element depending on its state.

CodePudding user response：

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"}