title: Selecting Multiple options in Reactjs
body: <p>I have some data in arrays. I am getting it by using map, as you see in the below example. Also, i pass that into the button. Now, if, i select a button, it will get selected. But, if i select the next button, the previous button will get unselected and the current button will get selected. I don't want it to happen. I want to select multi buttons, if it all get clicked.</p>
  
  <p>Thanks in advance.</p>
  
  <p><strong>Below is the Solution</strong></p>
  
  <pre><code>   import React, { Component } from 'react';
  
  
  const BUTTONS = [
      {id:0, title:'button1'},
      {id:1, title:'button2'},
      {id:2, title:'button3'}
  ]
  class Map extends Component {
      constructor(props){
          super(props);
          this.state = {
              values: []
          }
      }
      handleButton = button =&gt; {
          let tmp = this.state.values;
          if (this.state.values.includes(button)) {
              this.setState({
                  values: this.state.values.filter(el =&gt; el !== button)
              })
          } else {
              tmp.push(button);
              this.setState({
                  values: tmp
              })
          }
      }
  
      render () {
          return (
              &lt;div&gt;
                  {BUTTONS.map(bt=&gt;(
                  &lt;button 
                      key={bt.id} 
                      onClick={()=&gt;this.handleButton(bt.id)} 
                      className={this.state.values.includes(bt.id) ? "buttonPressed" : "button"}&gt;
                      {bt.title}
                  &lt;/button&gt;
                  ))}
              &lt;/div&gt;
          );
      }
  } 
  
  export default Map;
  </code></pre>