on vue3 repo multiselect is always shows as taggable

[Oscar Muñoz]

with the Vue3 when doing the normal multiselect exmple, it always display it has tags

I'm Using this example from the docs

<template>
  <multiselect
      v-model="value"
      :options="[
              { name: 'Vue.js', language: 'JavaScript' },
              { name: 'Adonis', language: 'JavaScript' },
              { name: 'Rails', language: 'Ruby' },
              { name: 'Sinatra', language: 'Ruby' },
              { name: 'Laravel', language: 'PHP' },
              { name: 'Phoenix', language: 'Elixir' }
            ]"
      :multiple="true"
      :close-on-select="false"
      :clear-on-select="false"
      :preserve-search="true"
      placeholder="Pick some"
      label="name"
      track-by="name"
      :preselect-first="true">
  </multiselect>
</template>

<script>
import Multiselect from 'vue-multiselect'

export default {
  components: {Multiselect},
  data() {
    return {
      value: [],
      options: [
        {name: 'Vue.js', language: 'JavaScript'},
        {name: 'Adonis', language: 'JavaScript'},
        {name: 'Rails', language: 'Ruby'},
        {name: 'Sinatra', language: 'Ruby'},
        {name: 'Laravel', language: 'PHP'},
        {name: 'Phoenix', language: 'Elixir'}
      ]
    }
  },
};
</script>

I get this view even adding :taggable="false"

in my package.json i added "vue-multiselect": "^3.0.0-beta.2",

and this is my yarn lock

vue-multiselect@^3.0.0-beta.2:
  version "3.0.0-beta.2"
  resolved "https://registry.yarnpkg.com/vue-multiselect/-/vue-multiselect-3.0.0-beta.2.tgz#dcfc1f8bc5bff78d85d516bfd71339fce49be97a"
  integrity sha512-TFVHtI/KdWoD3Opzbkso8OIqkZlZEqFF7f2jlYx1ttgC4Jv/48IGlU5zn6cBR4p2bFDFGCHF5SkLCaadLhnBPQ==

[Oleg Kochetkov]

@mojv I have the same problem.
Did you find the solution?

[Oscar Muñoz]

Is not a problem, I just didn't realise that vue-multiselect component work with a slot which default are the tags, and you can replace those tags by overriding the slot like this:

  <multiselect
      v-model="value"
      :options="[
              { name: 'Vue.js', language: 'JavaScript' },
              { name: 'Adonis', language: 'JavaScript' },
              { name: 'Rails', language: 'Ruby' },
              { name: 'Sinatra', language: 'Ruby' },
              { name: 'Laravel', language: 'PHP' },
              { name: 'Phoenix', language: 'Elixir' }
            ]"
      :multiple="true"
      :close-on-select="false"
      :clear-on-select="false"
      :preserve-search="true"
      placeholder="Pick some"
      label="name"
      track-by="name"
      :preselect-first="true">
    <template v-slot:selection><span class="multiselect__single" v-if="value.length">{{ value.length }} options selected</span></template>
</multiselect>

[Oleg Kochetkov]

@mojv Work for me, too. Thank you so much!