title: vuejs how to iterate only part of array using v-for
body: <p>I've got an array as below:</p>
  
  <pre><code>return {
     items: [
        {active: true, text: 'text1'},
        {active: true, text: 'text2'},
        {active: true, text: 'text3'},
        {active: true, text: 'text4'},
        {active: true, text: 'text5'}
        ...
     ]
  }
  </code></pre>
  
  <p>I want to iterate it in the DOM using <code>v-for</code> (easy) but I want to iterate them in two templates - first 3 elements of the array in template1 and the rest of elements in template2:</p>
  
  <p>template1:</p>
  
  <pre><code>&lt;template v-for="item in items"&gt;
     first 3 elements:
     {{item}}
  &lt;/template&gt;
  </code></pre>
  
  <p>template2:</p>
  
  <pre><code>&lt;template v-for="item in items"&gt;
     the rest of elements: 
     {{item}}
  &lt;/template&gt;
  </code></pre>
  
  <p>How should I modify my <code>v-for</code> to make this work?</p>