\n\n## Features & characteristics:\n* NO dependencies\n* Single select\n* Multiple select\n* Tagging\n* Dropdowns\n* Filtering\n* Search with suggestions\n* Logic split into mixins\n* Basic component and support for custom components\n* V-model support\n* Vuex support\n* Async options support\n* \\> 95% test coverage\n* Fully configurable (see props list below)\n\n## Breaking changes:\n* Instead of Vue.partial for custom option templates you can use a custom render function.\n* The `:key` props has changed to `:track-by`, due to conflicts with Vue 2.0.\n* Support for `v-model`\n* `@update` has changed to `@input` to also work with v-model\n* `:selected` has changed to `:value` for the same reason\n* Browserify users: if you wish to import `.vue` files, please add `vueify` transform.\n\n## Install & basic usage\n\n```bash\nnpm install vue-multiselect\n```\n\n```vue\n\n
\n \n \n
\n\n\n\n\n\n```\n\n## JSFiddle\n\n[Example JSFiddle](https://jsfiddle.net/shentao/s0ugwmjp/) – Use this for issue reproduction.\n\n## Examples\nin jade-lang/pug-lang\n\n### Single select / dropdown\n``` jade\nmultiselect(\n :value=\"value\",\n :options=\"source\",\n :searchable=\"false\",\n :close-on-select=\"false\",\n :allow-empty=\"false\",\n @input=\"updateSelected\",\n label=\"name\",\n placeholder=\"Select one\",\n track-by=\"name\"\n)\n```\n\n### Single select with search\n``` jade\nmultiselect(\n v-model=\"value\",\n :options=\"source\",\n :close-on-select=\"true\",\n :clear-on-select=\"false\",\n placeholder=\"Select one\",\n label=\"name\",\n track-by=\"name\"\n)\n```\n\n### Multiple select with search\n``` jade\nmultiselect(\n v-model=\"multiValue\",\n :options=\"source\",\n :multiple=\"true\",\n :close-on-select=\"true\",\n placeholder=\"Pick some\",\n label=\"name\",\n track-by=\"name\"\n)\n```\n\n### Tagging\nwith `@tag` event\n``` jade\nmultiselect(\n v-model=\"taggingSelected\",\n :options=\"taggingOptions\",\n :multiple=\"true\",\n :taggable=\"true\",\n @tag=\"addTag\",\n tag-placeholder=\"Add this as new tag\",\n placeholder=\"Type to search or add tag\",\n label=\"name\",\n track-by=\"code\"\n)\n```\n\n``` javascript\n\naddTag (newTag) {\n const tag = {\n name: newTag,\n code: newTag.substring(0, 2) + Math.floor((Math.random() * 10000000))\n }\n this.taggingOptions.push(tag)\n this.taggingSelected.push(tag)\n},\n```\n\n### Asynchronous dropdown\n``` jade\nmultiselect(\n v-model=\"selectedCountries\",\n :options=\"countries\",\n :multiple=\"multiple\",\n :searchable=\"searchable\",\n @search-change=\"asyncFind\",\n placeholder=\"Type to search\",\n label=\"name\"\n track-by=\"code\"\n)\n span(slot=\"noResult\").\n Oops! No elements found. Consider changing the search query.\n```\n\n``` javascript\nmethods: {\n asyncFind (query) {\n this.countries = findService(query)\n }\n}\n```\n\n## Contributing\n\n``` bash\n# serve with hot reload at localhost:8080\nnpm run dev\n\n# distribution build with minification\nnpm run bundle\n\n# build the documentation into docs\nnpm run docs\n\n# run unit tests\nnpm run test\n\n# run unit tests watch\nnpm run unit\n\n```\n\nFor detailed explanation on how things work, checkout the [guide](http://vuejs-templates.github.io/webpack/) and [docs for vue-loader](http://vuejs.github.io/vue-loader).\n","readmeFilename":"README.md"}
![\"Vue-Multiselect](\"/multiselect-screen-203.png\")
\n![\"Vuejs](\"https://cdn.discordapp.com/attachments/793583797454503976/793583831369646120/vuejsamsterdam.png\")
\n \n![\"Vue](\"https://cdn.discordapp.com/attachments/793583797454503976/809062891420123166/logo.png\"){kind=logo}
\n \n![\"Storyblok\"](\"https://a.storyblok.com/f/51376/3856x824/fea44d52a9/colored-full.png\")
\n \n![\"Vue](\"https://cdn.discordapp.com/attachments/258614093362102272/557267759130607630/Vue-Mastery-Big.png\")
\n \n