title: how to make dynamic vue tabs, loading data from api
body: <p>I'm trying to make tabs, which are a list of categories from an API obtained through vuex. How do I load data of a certain category by ID in tab content when clicking on a specific tab?</p>
  <pre class="lang-html prettyprint-override"><code>&lt;ul class=&quot;tabs&quot;&gt;
     &lt;li class=&quot;list-group-item&quot; v-for=&quot;(category, index) in SUB_CATS(681)&quot; :key=&quot;category.id&quot;&gt;
        &lt;button class=&quot;d-block tab-btn&quot; :class=&quot;['tab-button', { active: currentTab === index[0] }]&quot;&gt; 
          {{category.title}}
        &lt;/button&gt;
     &lt;/li&gt;
  &lt;/ul&gt;
  //tabs-content
  
  &lt;div class=&quot;tab-content&quot;&gt;
     &lt;div class=&quot;tab-pane fade&quot; 
       v-for=&quot;product in products&quot; :key=&quot;product.id&quot;
       :class=&quot;{ 'active show': isActive('tab-1')}&quot;&gt;
        &lt;div class=&quot;product-item&quot;&gt;
          {{ product.name }}
        &lt;/div&gt;
    &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>