title: vue.js checkboxes not updating properly in chrome
body: <p>I am new to Vue.js. Basically, I have two checkboxes and I want them to behave like a radio-buttons (I know I can use a radio but I wanna know what the problem is) It works fine in Safari, but not in Chrome. </p>
  
  <p>these are the checkboxes:</p>
  
  <pre><code>&lt;label class="list-display" for="list-box"&gt;
     &lt;input type="checkbox" id="list-box" v-model="list"
      v-on:click='mini=!list'&gt;
     &lt;span class="switch"&gt;
       &lt;p&gt;list&lt;/p&gt;
     &lt;/span&gt;
  &lt;/label&gt;
  
  &lt;label class='list-display' for="mini-box"&gt;
     &lt;input type="checkbox" id="mini-box" v-model="mini"
      v-on:click='list=!mini'&gt;
     &lt;span class="switch"&gt;
       &lt;p&gt;mini&lt;/p&gt;
     &lt;/span&gt;
  &lt;/label&gt;
  </code></pre>
  
  <p>and in data I declare</p>
  
  <pre><code>list: true,
  mini: false,
  </code></pre>
  
  <p>It checks the first box #mini-box when it loads but when the boxes are clicked the both toggle true or false</p>
  
  <p>Thank you for any help!</p>