title: Vuejs multiple active buttons
body: <p>I'm trying to create a list where every list item contains a button and i want a user to be able to click multiple button. I'm generating my list like so:</p>
  
  <pre><code>    &lt;ul&gt;
        &lt;li v-for="item in items" :key="item.id"&gt;
          &lt;button type="button"&gt;{{item.title}}&lt;/button&gt;
        &lt;/li&gt;
      &lt;/ul&gt;
  </code></pre>
  
  <p>but the problem with my code is whenever a user click a button, it turns the rest of the buttons to "unclicked". been trying to play with the <code>focus</code> and <code>active</code> stats but even with just css i cant get to enable multiple select .
  i did manage to change the look of the current selected button:</p>
  
  <pre><code>button:focus {
    outline: none;
    background-color: #6acddf;
    color: #fff;
  }
  </code></pre>
  
  <p>any idea how can i allow multiple buttons to be clicked?</p>
  
  <p>to make things  a bit clearer, i am going to create an AJAX call later and pass the <code>item.id</code> of each item where it's button is clicked</p>