Installation

NPM

npm install @desislavsd/vue-select

Then import and install the plugin

import '@desislavsd/vue-select/dist/vue-select.css'
import VueSelect from '@desislavsd/vue-select'

Vue.use(VueSelect, { /* options */ } ) // registers <v-select /> globally

Or use without installation in .vue files:

import { vSelect } from '@desislavsd/vue-select'

export default {
    components: { vSelect }
}

Direct <script> include

Include after the the vue.js script tag:

<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@desislavsd/vue-select/dist/vue-select.css">
<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/vue"></script>
<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/@desislavsd/vue-select"></script>

Then in your JavaScript file:

Vue.use(VueSelect, { /* options */ } ) /* registers <v-select /> globally

or without global installation:

new Vue({
    el: '#app',
    components: { vSelect: VueSelect.vSelect }
})

Plugin options and defaults

Installing the plugin makes the select component globally available throughout the app using Vue.component. Here are the available options and their defaults:

Vue.use(VueSelect, {
    /** 
     * The name of the globally available component.
     * defaults to <v-select>
     */
    name: 'vSelect',
    
    /**
     * A Vue mixin that can be used to override
     * default options and methods of the original 
     * component. Useful to define app specific 
     * standart of the select component.
     */
    mixin: {}
})

The options are applied as follows:

let { name, mixin } = options;

Vue.component(name, {
    mixins: [ vSelect, mixin ]
});

Last updated