Jak na sublist

<template>

  <ul  v-for="list in listTabs" :title="list.title" :id="list.id" :key="list.id">
    <li>

     {{list.title}}
      <!-----                        TAKTO TO NEFUNGUJE ---
      <ul v-for="sublist in listTabs[idecko-zaznamu-z-nadrazeneho-for].subtabs" :title="sublist.title" :id="sublist.id" :key="sublist.id">
        <li>
        {{sublist.title}}
        </li>
      </ul>

    </li>
  </ul>

</template>

<script>
import {ref} from "vue";

export default {
  name: 'App',
  components: {
  },
  props: {
    title:{
      type: String
    },
    id:{
      type: Number
    }
  },
  data()
  {
    const listTabs = ref(
    [
      {
          id: 1,
          parent : 0,
          title: 'TAB ONE',
          subtabs: [
              {
                  id: 2,
                  parent : 1,
                  title: 'TAB ONE Sub-1',
                  cards: [
                      {
                          id: 3,
                          parent : 2,
                          title: 'Card-1',
                          labels: ['work', '3D print', 'travel'],
                          tags: ['JOB', 'HOBBY', 'BIKE'],
                          text: 'test text - 1'
                      }
                  ]
              },
              {
                  id: 7,
                  parent : 1,
                  title: 'TAB ONE Sub-1',
                  cards: [
                      {
                          id: 8,
                          parent : 7,
                          title: 'Card-2',
                          labels: ['yellow', 'blue', 'red', 'green', 'purple'],
                          tags: ['very', 'good', 'boy'],
                          text: 'test text - subTab-2'
                      }
                  ]
              }
          ]
      },
      {
          id: 4,
          parent:0,
          title: 'TAB TWO',
          subtabs: [
              {
                  id: 5,
                  parent : 4,
                  title: 'TAB TWO Sub-1',
                  cards: [
                      {
                          id: 6,
                          parent : 5,
                          title: 'Card-3',
                          labels: ['yellow', 'blue', 'red', 'green', 'purple'],
                          tags: ['very', 'good', 'boy'],
                          text: 'test text - 2'
                      }
                  ]
              },
              {
                  id: 9,
                  parent : 5,
                  title: 'TAB TWO Sub-2',
                  cards: [
                      {
                          id: 6,
                          parent : 5,
                          title: 'Card-4',
                          labels: ['yellow', 'blue', 'red', 'green', 'purple'],
                          tags: ['very', 'good', 'boy'],
                          text: 'test text - 2'
                      }
                  ]
              }
          ]
      }
    ]
    );

    //console.log(listTabs[0]);

    return {
      listTabs
    }
  }
}
</script>