/Javascript/React/How to change style class by using onclick function with multiple buttons in react js

How to change style class by using onclick function with multiple buttons in react js

/*
 * A simple React component
 */
class Button extends React.Component {   
    constructor(){
    super(); 
    this.state = {
        color_black: true,
      }
    }
    changeColor(){
            this.setState({color_black: !this.state.color_black})
    }
        render(){
        let bgColor = this.state.color_black ? this.props.color : this.props.color2
        return (
        <div>
            <button style={{backgroundColor: bgColor}} onClick={this.changeColor.bind(this)}>Button1</button>
        </div>
      )
    }
}

class Application extends React.Component {
        render(){
        return (
        <div>
            <Button color="blue" color2="red"/>
            <Button color="black" color2="white"/>
        </div>    
      )
    }
}
/*
 * Render the above component into the div#app
 */
React.render(<Application />, document.getElementById('app'));

Source: stackoverflow.com

Similar codes

11 votes358 views4 answers
How to check for react version
Javascript React
18 votes333 views2 answers
How to import background image in inline css in react
Javascript React
1 vote362 views1 answer
How to check if bottom tab is active in react native material bottom tab
Javascript React
5 votes324 views2 answers
Update react version
Javascript React
1 vote336 views1 answer
How to update version of dependencies reactjs
Javascript React
0 vote319 views1 answer
React Spread Attributes conditionally
Javascript React
0 vote342 views1 answer
How to check if we reach end of div react hooks
Javascript React
2 votes315 views1 answer
React native open email client expo
Javascript React
0 vote342 views1 answer
React native init specific version
Javascript React
0 vote323 views1 answer
How to make multiple link using react
Javascript React