title: Displaying checkbox selected rows with vuejs
body: <p>I'm starting out with vuejs and a vue grid  at <a href="https://jsfiddle.net/kc11/7fqgavvq/2/" rel="nofollow noreferrer">https://jsfiddle.net/kc11/7fqgavvq/2/</a>.</p>
  
  <p>I want to  display the checked row objects in the:</p>
  
  <pre><code>    &lt;pre&gt; {{ selected| json}} &lt;/pre&gt;
  </code></pre>
  
  <p>at the bottom of the table. I've come across <a href="https://stackoverflow.com/questions/33571382/check-all-checkboxes-vuejs">Check all checkboxes vuejs</a> with an associated fiddle at <a href="https://jsfiddle.net/okv0rgrk/206/" rel="nofollow noreferrer">https://jsfiddle.net/okv0rgrk/206/</a> that shows what I mean if you look at the outputted Selected Ids.</p>
  
  <p>To get this working I'll need to add a method to the table component similar to  </p>
  
  <pre><code>methods: {
      selectAll: function() {
          this.selected = [];
          for (user in this.users) {
              this.selected.push(this.users[user].id);
          }
      }
  </code></pre>
  
  <p>in <a href="https://jsfiddle.net/okv0rgrk/206/" rel="nofollow noreferrer">https://jsfiddle.net/okv0rgrk/206/</a></p>
  
  <p>Can someone explain this function as I am having trouble in particular with what 'this' means in this context.</p>