title: vue-multiselect with both tagging and async, stops working
body: <p>I'm using vue-multiselect and I would like the user to be able to search tags in the database using async and if they don't find what they want, enter their own tag. This means I'm using tagging and async. It works as expected until I add a tag not found in the , then the aysnc no longer searches. If I remove the added tag, then it does the async search again..</p>
  
  <pre><code>&lt;template&gt;
  
      &lt;div&gt;
        &lt;label class="typo__label" for="ajax"&gt;Async multiselect&lt;/label&gt;
        &lt;multiselect v-model="selectedTags" id="tags" label="name" track-by="code" placeholder="Type to search" open-direction="bottom" :options="tags" :taggable="true" @tag="addTag" :multiple="true" :searchable="true" :loading="isLoading" :internal-search="false" :clear-on-select="true" :close-on-select="false" :options-limit="300" :limit="3" :limit-text="limitText" :max-height="600" :show-no-results="false" :hide-selected="true" @search-change="asyncFind"&gt;
          &lt;template slot="clear" slot-scope="props"&gt;
            &lt;div class="multiselect__clear" v-if="selectedTags.length" @mousedown.prevent.stop="clearAll(props.search)"&gt;&lt;/div&gt;
          &lt;/template&gt;&lt;span slot="noResult"&gt;Oops! No elements found. Consider changing the search query.&lt;/span&gt;
        &lt;/multiselect&gt;
        &lt;pre class="language-json"&gt;&lt;code&gt;{{ selectedTags  }}&lt;/code&gt;&lt;/pre&gt;
      &lt;/div&gt;
  
  &lt;/template&gt;
  
  
  &lt;script&gt;
  import axios from 'axios';
  import Multiselect from 'vue-multiselect'
  
  export default {
    components: {
      Multiselect
    },
    props: {
        userId: {
          type: Number,
          required: true
        },
      tagGroup: {
        type: String,
        required: true
      }
    },
    data () {
      return {
        selectedTags: [],
        tags: [],
        isLoading: false
      }
    },
    methods: {
      addTag (newTag) {
          const tag = {
            name: newTag
          }
          this.tags.push(tag)
          this.selectedTags.push(tag)
        },
        limitText (count) {
          return `and ${count} other tags`
        },
        asyncFind (query) {
          if( query.length &gt; 3 ) {
            this.isLoading = true
           axios.get('/api/tags/'+this.tagGroup+'/'+query).then(response =&gt; {
              this.tags = response.data.results.map(a =&gt; {
                 return { name: a.name.en };
              });
          })
         }
        },
        clearAll () {
          this.selectedTags = []
        }
    }
  }
  
  &lt;/script&gt;
  </code></pre>
  
  <p>I'm using the component twice within another component:</p>
  
  <pre><code>&lt;user-tags v-bind:tagGroup="'industry'" :typeahead-activation-threshold="2" :userId="user.id" :isSearchable="true"&gt;&lt;/user-tags&gt;
  
  
  &lt;user-tags v-bind:tagGroup="'expertise'" :typeahead-activation-threshold="2" :userId="user.id" :isSearchable="true"&gt;&lt;/user-tags&gt;
  </code></pre>