title: Add flat array to v-model by multiple checkboxes in VueJS
body: <p>in my Vue component I have checkboxes with array of items set to checkbox value:</p>
  
  <pre><code>&lt;div v-for="group in groups"&gt;
  
     &lt;input type="checkbox" v-model="selected" :value="group"&gt;       
  
     &lt;template v-for="item in group"&gt;
        &lt;input type="checkbox" :value="item" v-model="selected"&gt;
     &lt;/template&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>My object groups is array of arrays looks like this:</p>
  
  <pre><code>let groups = [
    [
      {id:1, foo1: '...', foo2: '...'}, 
      {id:2, foo1: '...', foo2: '...'}
    ], 
    [
      {id:5, foo1: '...', foo2: '...'}, 
      {id:8, foo1: '...', foo2: '...'}
    ],
  ];
  </code></pre>
  
  <p>So in template <code>item</code> is represented by array. My goals is when I check checkbox, to model <code>selected</code> will append flat array so for example when I check both checkboxes generated in loop, I will got in my <code>selected</code> 4 objects instead of 2 arrays of objects. (selected will <code>[{id: 1, ...}, {id: 2, ...}, {id: 5, ...}, {id: 8, ...}]</code> )</p>
  
  <p>It also should works when some checkbox is unchecked. For example when I uncheck first checkbox, I will got in <code>selected</code> items of second checkbox instead of array. (selected will <code>[{id: 5, ...}, {id: 8, ...}]</code> )</p>
  
  <p>I need that because I need check or uncheck whole group of checkboxes.</p>
  
  <p>Is possible do that in Vue? I didn't find anything about it in docs. Thanks.</p>