Hello Dev,

Today, i we will show you Vue JS Multiple Select Dropdown Example. This article will give you simple example of Vue JS Multiple Select Dropdown Example. you will learn Vue JS Multiple Select Dropdown Example. So let’s follow few step to create example of Vue JS Multiple Select Dropdown Example.

You need to just follow few steps to add Multiple Select Dropdown, so let’s see.

Step 1:- Create Vue App

vue create myApp

Step 2:- Install vue-multiselect Package

npm install vue-multiselect

Step 3:- Updated HelloWorld Component

src/components/HelloWorld.vue

<template>
  <div>
    <h1>Vue JS Multiple Select Dropdown</h1>
    <multiselect
      v-model="selected"
      :multiple="true"
      :options="options">
    </multiselect>
  </div>
</template>    
<script>
  import Multiselect from 'vue-multiselect'
  export default {
    components: { Multiselect },
    data () {
      return {
        selected: null,
        options: ['Laravel', 'Laravel 8', 'Vue JS', 'codeplaners.com']
      }
    }
  }
</script>
<style src="vue-multiselect/dist/vue-multiselect.min.css">

npm run serve

You can see officially docs from here: vue-multiselect.js.org.