reactHuyakt.js

export default class BtnGroup extends React.Component {
  state = {
    active: null
  };

  onClick = (id) => {
    this.setState({ active: id });
  }

  render() {
    const { active } = this.state;
    
    const getClass = (cls, id) => [
      cls
      'btn', 
      'btn-secondary', 
      active === id ? 'active' : '',
    ].join(' ');
    
    return <div className="btn-group" role="group">
  <button onClick={() => this.onClick(0)} type="button" className={getClass('left', 0)}>Left</button>
  <button onClick={() => this.onClick(1)} type="button" className={getClass('right', 1)}>Right</button>
</div>;
  }
}