sweetboicz

Jak na sublist

Apr 23rd, 2021 (edited)
633
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. <template>
  2.  
  3.   <ul  v-for="list in listTabs" :title="list.title" :id="list.id" :key="list.id">
  4.     <li>
  5.      
  6.      {{list.title}}
  7.       <!-----                        TAKTO TO NEFUNGUJE ---
  8.       <ul v-for="sublist in listTabs[idecko-zaznamu-z-nadrazeneho-for].subtabs" :title="sublist.title" :id="sublist.id" :key="sublist.id">
  9.         <li>
  10.         {{sublist.title}}
  11.         </li>
  12.       </ul>
  13.      
  14.     </li>
  15.   </ul>
  16.  
  17. </template>
  18.  
  19. <script>
  20. import {ref} from "vue";
  21.  
  22. export default {
  23.   name: 'App',
  24.   components: {
  25.   },
  26.   props: {
  27.     title:{
  28.       type: String
  29.     },
  30.     id:{
  31.       type: Number
  32.     }
  33.   },
  34.   data()
  35.   {
  36.     const listTabs = ref(
  37.     [
  38.       {
  39.           id: 1,
  40.           parent : 0,
  41.           title: 'TAB ONE',
  42.           subtabs: [
  43.               {
  44.                   id: 2,
  45.                   parent : 1,
  46.                   title: 'TAB ONE Sub-1',
  47.                   cards: [
  48.                       {
  49.                           id: 3,
  50.                           parent : 2,
  51.                           title: 'Card-1',
  52.                           labels: ['work', '3D print', 'travel'],
  53.                           tags: ['JOB', 'HOBBY', 'BIKE'],
  54.                           text: 'test text - 1'
  55.                       }
  56.                   ]            
  57.               },
  58.               {
  59.                   id: 7,
  60.                   parent : 1,
  61.                   title: 'TAB ONE Sub-1',
  62.                   cards: [
  63.                       {
  64.                           id: 8,
  65.                           parent : 7,
  66.                           title: 'Card-2',
  67.                           labels: ['yellow', 'blue', 'red', 'green', 'purple'],
  68.                           tags: ['very', 'good', 'boy'],
  69.                           text: 'test text - subTab-2'
  70.                       }
  71.                   ]            
  72.               }  
  73.           ]
  74.       },
  75.       {
  76.           id: 4,
  77.           parent:0,
  78.           title: 'TAB TWO',
  79.           subtabs: [
  80.               {
  81.                   id: 5,
  82.                   parent : 4,
  83.                   title: 'TAB TWO Sub-1',
  84.                   cards: [
  85.                       {
  86.                           id: 6,
  87.                           parent : 5,
  88.                           title: 'Card-3',
  89.                           labels: ['yellow', 'blue', 'red', 'green', 'purple'],
  90.                           tags: ['very', 'good', 'boy'],
  91.                           text: 'test text - 2'
  92.                       }
  93.                   ]            
  94.               },
  95.               {
  96.                   id: 9,
  97.                   parent : 5,
  98.                   title: 'TAB TWO Sub-2',
  99.                   cards: [
  100.                       {
  101.                           id: 6,
  102.                           parent : 5,
  103.                           title: 'Card-4',
  104.                           labels: ['yellow', 'blue', 'red', 'green', 'purple'],
  105.                           tags: ['very', 'good', 'boy'],
  106.                           text: 'test text - 2'
  107.                       }
  108.                   ]            
  109.               }  
  110.           ]
  111.       }
  112.     ]
  113.     );
  114.    
  115.     //console.log(listTabs[0]);
  116.  
  117.     return {
  118.       listTabs
  119.     }
  120.   }
  121. }
  122. </script>
  123.  
RAW Paste Data

Adblocker detected! Please consider disabling it...

We've detected AdBlock Plus or some other adblocking software preventing Pastebin.com from fully loading.

We don't have any obnoxious sound, or popup ads, we actively block these annoying types of ads!

Please add Pastebin.com to your ad blocker whitelist or disable your adblocking software.

×