title: How to make a recursive menu using Quasar QexpansionItem
body: <p>I want create a component that it can to scale with a nested object structure using the QExpansionItem from Quasar Framework.</p>
  
  <p>I made a recursive component to try achieve this but doesn't shows like i hope. The items are repeated in a wrong way and I don't know why.</p>
  
  <p>I am using Quasar V1.0.5, the component that i used QexpansionItem</p>
  
  <p>Here the menu object </p>
  
  <pre class="lang-py prettyprint-override"><code>
  [
  {
      name: '1',
      icon: 'settings',
      permission: 'configuration',
      description: '1',
      url: '',
      children: [
        {
          name: '1.1',
          permission: 'configuration',
          url: '/insuranceTypes',
          icon: 'add',
          description: '1.1'
        },
        {
          name: '1.2',
          permission: 'configuration',
          url: '/insuranceTypes2',
          icon: 'phone',
          description: '1.2'
        }
      ]
    }, {
      name: '2',
      icon: 'person',
      permission: 'configuration',
      url: 'contacts',
      description: '2'
    }
    ]
  </code></pre>
  
  <p>MenuComponent.vue where i call side-tree-menu component</p>
  
  <pre><code>&lt;q-list
          bordered
          class="rounded-borders q-pt-md"
        &gt;
          &lt;side-tree-menu :menu="menu"&gt;&lt;/side-tree-menu&gt;
  
        &lt;/q-list&gt;
  </code></pre>
  
  <p>SideTreeMenuComponent.vue</p>
  
  <pre><code>&lt;template&gt;
    &lt;div&gt;
  
      &lt;q-expansion-item
        expand-separator
        :icon="item.icon"
        :label="item.name"
        :caption="item.description"
        header-class="text-primary"
        :key="item.name"
        :to="item.url"
        v-for="(item) in menu"
      &gt;
  
        &lt;template&gt;
          &lt;side
            v-for="(subitem) in item.children"
            :key="subitem.name"
            :menu="item.children"
          &gt;
          &lt;/side&gt;
        &lt;/template&gt;
  
      &lt;/q-expansion-item&gt;
  
    &lt;/div&gt;
  &lt;/template&gt;
  
  &lt;script&gt;
  import { mapGetters } from 'vuex'
  export default {
    name: 'side',
    props: ['menu', 'children'],
    data () {
      return {
        isOpen: false,
        algo: 0
      }
    },
    mounted () {
      console.log('menu', this.menu)
    },
    computed: {
      ...mapGetters('generals', ['can'])
    }
  }
  &lt;/script&gt;
  
  </code></pre>
  
  <p>The elements 1.1 and 1.2 are repeated and I don't know fix it</p>