title: Array filter in VueJS
body: <p>I have a child Dropdown component when opened and a value is selected its "tags" are passed back to the parent as an Array. This all works fine and I get these. </p>
  
  <p>I then want to take these tags and compare them against an array called Results. This is working OK I guess but say it checks the results array for tags called "wedding", "dining", "spa" it will go to the Results array and if the first one is "wedding" it sets active to true but then next the one could be "gym" which isn't a match so then active is false.</p>
  
  <p>Hopefully I have explained my dilemma well. Any help would be greatly appreciated.</p>
  
  <pre><code>&lt;template&gt;
    &lt;div&gt;
      &lt;div class="profiler"&gt;
        &lt;div class="in"&gt;
          &lt;div class="profiler__heading"&gt;
            &lt;div class="profiler__heading--icon"&gt;
              &lt;img src="/static/img/svg/profiler-white.svg" /&gt;
            &lt;/div&gt;
            &lt;div class="profiler__heading--title"&gt;
              &lt;h6 class="heading heading--uppercase"&gt;TELL US ABOUT YOU AND LET US PERSONALISE YOUR EXPERIENCE&lt;/h6&gt;
            &lt;/div&gt;
          &lt;/div&gt;
          &lt;div class="profiler__form"&gt;
            &lt;div class="profiler__form--row"&gt;
              &lt;span&gt;I'm visiting Conrad Algarve for a &lt;/span&gt;
              &lt;dropdown @menu-tags="menuTags" v-bind:dropdown="visiting"&gt;&lt;/dropdown&gt;
            &lt;/div&gt;
            &lt;div class="profiler__form--row"&gt;
              &lt;span&gt;I'm interested in&lt;/span&gt;
              &lt;!-- Pass down to child a custom event listener called is-menu-visible and assign 
                 to a function called isMenuVisible (See dropdown.vue) --&gt;
              &lt;dropdown v-bind:dropdown="interestedOne"&gt;&lt;/dropdown&gt;
              &lt;span&gt;and&lt;/span&gt;
              &lt;dropdown v-bind:dropdown="interestedTwo"&gt;&lt;/dropdown&gt;
            &lt;/div&gt;
          &lt;/div&gt;
          &lt;div class="profiler__options"&gt;
            &lt;div class="profiler__options--filter"&gt;
              &lt;a href="#"&gt;SHOW MY EXPERIENCES&lt;/a&gt;
            &lt;/div&gt;
            &lt;div class="profiler__options--hide"&gt;
              &lt;a href="#"&gt;SKIP. I’D RATHER LOOK AROUND&lt;/a&gt;
            &lt;/div&gt;
          &lt;/div&gt;
        &lt;/div&gt;
      &lt;/div&gt;
      &lt;div class="profilerResults"&gt;
        &lt;div class="box" v-for="result in results" v-if="result.active"&gt;{{ result.title }} {{ result.tags }}&lt;/div&gt;
      &lt;/div&gt;
    &lt;/div&gt;
  &lt;/template&gt;
  
  &lt;script&gt;
    import Dropdown from './ui/Dropdown'
    export default {
      name: "Profiler",
      components: {
        'dropdown': Dropdown
      },
  
      data() {
        return {
          currentTags: [],
          activeTags: [],
          visiting: [{
              title: 'Wedding/Vacation',
              tags: [
                'weddings',
                'dining',
                'spafitness'
              ]
            },
            {
              title: 'Holiday',
              tags: [
                'dining',
                'spanfitness',
                'experiences',
                'poolbeach',
                'whatson'
              ]
            },
            {
              title: 'Special Occasion',
              tags: [
                'weddings',
                'dining',
                'spafitness',
                'golf',
                'whatson',
                'experiences'
              ]
            },
            {
              title: 'Business Trip',
              tags: [
                'meetingsevents',
                'golf'
              ]
            }
          ],
          interestedOne: [{
              title: 'What\s On',
            },
            {
              title: 'Family Fun',
            },
            {
              title: 'Relaxing',
            },
            {
              title: 'Exploring',
            },
            {
              title: 'Dining',
            },
            {
              title: 'Meetings &amp; Events',
            },
            {
              title: 'Golf',
            }
          ],
          interestedTwo: [{
              title: 'What\s On',
            },
            {
              title: 'Family Fun',
            },
            {
              title: 'Relaxing',
            },
            {
              title: 'Exploring',
            },
            {
              title: 'Dining',
            },
            {
              title: 'Meetings &amp; Events',
            },
            {
              title: 'Golf',
            }
          ],
          results: [{
              title: "Pools &amp; Beach",
              slug: 'poolbeach',
              tags: [
                'relaxing',
                'familyfun',
                'holidayvacation'
              ],
              active: false
            },
            {
              title: "Kids Club &amp; Games Room",
              slug: 'kidsclubgamesroom',
              tags: [
                'familyfun'
              ],
              active: false
            },
            {
              title: "What's On",
              slug: 'whatson',
              tags: [
                'specialoccasion',
                'holidayvacation',
                'dining',
                'whatson'
              ],
              active: false
            },
            {
              title: "Golf",
              slug: 'golf',
              tags: [
                'specialoccasion',
                'business',
                'relaxing',
                'meetingsevents',
                'golf'
              ],
              active: false
            },
            {
              title: "Experiences",
              slug: 'experiences',
              tags: [
                'specialoccasion',
                'holidayvacation',
                'relaxing',
                'dining',
                'whatson'
              ],
              active: false
            },
            {
              title: "Spa &amp; Fitness",
              slug: 'spafitness',
              tags: [
                'specialoccasion',
                'holidayvacation',
                'weddings',
                'whatson',
                'spafitness'
              ],
              active: false
            },
            {
              title: "Weddings",
              slug: 'weddings',
              tags: [
                'specialoccasion',
                'weddings'
              ],
              active: false
            },
            {
              title: "Dining",
              slug: 'dining',
              tags: [
                'specialoccasion',
                'holidayvacation',
                'weddings',
                'dining'
              ],
              active: false
            },
            {
              title: "Meetings &amp; Events",
              slug: 'meetingsevents',
              tags: [
                'business',
                'meetingsevents'
              ],
              active: false
            }
          ]
        }
      },
      watch: {
        currentTags: function () {
          //console.log(this.results);
          //this.results;
        },
      },
      methods: {
        filterCurrent() {
          var self = this;
          // var results = this.results;
          var activeTags = [];
  
          this.currentTags.tags.filter(function (tag) {
            activeTags.push(tag);
  
            this.results.filter(function (result) {
              result.tags.some(function (tag) {
                if (tag.indexOf(activeTags) != -1) {
                  result.active = true;
                } else {
                  result.active = false;
                }
              })
            })
  
          }, this)
        },
        menuTags(label) {
          this.currentTags = label;
          this.filterCurrent();
        },
      },
    }
  
  &lt;/script&gt;
  </code></pre>