There are times when you want to add html tag attributes in a React app. We normally add attributes based on some logic, for example if some state value is true set the value of the attribute as something. Example <div className={ this.state.isRisk ? "danger" : "normal">...</div> This will be either rendered as <div class="danger">...</div> or div class="normal">...</div>  based on the state value isRisk In the above case there is a value for the attribute, that is class="danger" . Sometimes you don’t want to have any value for the attribute. I was using a third party library which checks only if the attribute is present, it does not care about the attribute values. So I…

We may need to get a the event details in a onClick or onChange event handler. Normal event handler will look like this. <button onClick={ this.handleClick } >Save </button><input type="text" onChange={ this.handleChange } /> In the above case we are not passing any event details to handler function. Consider the input example above, we need to get the input value in event handler, how do we do it? We need to pass the event details to the handler function. This is how to do it. <input type="text" onChange={ (evt) => this.handleChange(evt) } /> The handleChange function handleChange(evt) { // ---------^ this variable will have the event details. //get the value of the input box…