title: Conditional List Rendering with Vuex state
body: <p>Initially I have a list of animations stored in Cards. Each card has a few tags. From a top filter menu I want to be able to display only Cards, that match with the filter that has been set. A vuex state holds the information of all currently applied filters.</p>
  
  <p>My markup looks like this: </p>
  
  <pre><code>    &lt;div class="Feed__cards"&gt;
        &lt;Card
          v-for="(card, index) in filteredCards"
          :key="card.id"
          :id="card.id"
          :name="card.name"
          :tags="card.tags"
          :description="card.description"
          :video="card.video"
          :valueset="getValueSet(index)"
          class="Feed__card"
        &gt;
        &lt;/Card&gt;
  </code></pre>
  
  <p>In my methods I wanted to do something like this (activeTagsElements is a computed property, mapState from Vuex): </p>
  
  <pre><code>compare(tags) {
        tags.forEach(tag =&gt; {
          if(this.activeTagsElements.includes(tag)){
            return true
          }
        })
      },
   getAllAnimations() {
        this.$axios.get('/api/animations/all')
         .then(response =&gt; {
          this.allCards = response.data;
          this.allMaxIndex = response.data.length - 1;
          response.data.forEach((animation, index) =&gt; {
            this.getTags(animation.id, index, this.allCards, this.allMaxIndex, 'all');
          });
        }).catch((error) =&gt; {
          console.log(error)
        })
      },
  getTags(id, index, slot, max, type) {
        this.$axios.get('/api/animationtags/' + id)
         .then(response =&gt; {
           slot[index].tags = response.data.map(tag =&gt; {
            return tag.name;
          });
          if(index == max &amp;&amp; type == 'initial'){
            this.initialLoad = true;
  
          } else if(index == max &amp;&amp; type == 'all') {
            this.allLoad = true;
          }
        }).catch((error) =&gt; {
          console.log(error);
        })
      }
  </code></pre>
  
  <p>I also tried watching the change of the vuex state but couldn't get to the point of how to get the actual tags from each element to compare it to the vuex state. </p>
  
  <p>Any hints are very appreciated.</p>