I am using vue-multiselect and I copied the example vue-multiselect multiple select

<div>
  <label class="typo__label">Simple select / dropdown</label>
  <multiselect v-model="value" :options="options" :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 slot="selection" slot-scope="{ values, search, isOpen }"><span class="multiselect__single" v-if="values.length &amp;&amp; !isOpen">{{ values.length }} options selected</span></template>
  </multiselect>
  <pre class="language-json"><code>{{ value  }}</code></pre>
</div>

In the example it can be seen that the tags are not present, this happens in all examples, by default the tagging its not present in any example.

But when using the code of the example the tagging does show,

• i tried using :taggable="false",
• i tried using <template #tag></template>
• I also inspected, and it's not CSS hiding it the tags are still showing. Here its the minimal code to reproduce the issue.

The Desired behaviour its to not show the tagging just like in the examples.

I am using vue-multiselect and I copied the example vue-multiselect multiple select

<div>
  <label class="typo__label">Simple select / dropdown</label>
  <multiselect v-model="value" :options="options" :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 slot="selection" slot-scope="{ values, search, isOpen }"><span class="multiselect__single" v-if="values.length &amp;&amp; !isOpen">{{ values.length }} options selected</span></template>
  </multiselect>
  <pre class="language-json"><code>{{ value  }}</code></pre>
</div>

In the example it can be seen that the tags are not present, this happens in all examples, by default the tagging its not present in any example.

But when using the code of the example the tagging does show,

• i tried using :taggable="false",
• i tried using <template #tag></template>
• I also inspected, and it's not CSS hiding it the tags are still showing. Here its the minimal code to reproduce the issue.

The Desired behaviour its to not show the tagging just like in the examples.

• javascript
• vue.js
• vue-multiselect

• Could you show us a little more code, preferably a minimal, reproducible example? stackoverflow./help/minimal-reproducible-example – samu Commented Jul 16, 2020 at 5:26
• @samu i did, codesandbox.io/s/vue-multiselect-no-tags-nuhsh?file=/src/… – David Lee Commented Jul 16, 2020 at 5:30

1 Answer 1

You should use <template slot="tag">{{ '' }}</template> to hide the tags.