Skip to content
A VueJS plugin that provides a searchable and reactive select list component with no dependencies.
Vue JavaScript
Branch: master
Clone or download
Silas Montgomery
Silas Montgomery Updated version and built
Latest commit 4bf42ea Jul 26, 2019
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
build Updated dev packages required and built Feb 22, 2019
dist Updated version and built Jul 26, 2019
src Prevent Firefox from going back on empty backspace Jul 26, 2019
.gitignore Updated dev packages required and built Feb 22, 2019
LICENSE Initial commit Feb 20, 2019
README.md Document missing event: @input Jun 23, 2019
package.json Updated version and built Jul 26, 2019

README.md

vue-dynamic-select

A VueJS plugin that provides a searchable and reactive select list component with no dependencies.

alt text

View Online Demos Here

Installation

npm install vue-dynamic-select --save

Import

import DynamicSelect from 'vue-dynamic-select'

Vue.use(DynamicSelect)

Usage

// Static options source (array)
<dynamic-select 
    :options="objectArray"
    option-value="id"
    option-text="name"
    placeholder="type to search"
    v-model="selectedObject" />

// Dynamic options source (ajax, etc)
<dynamic-select 
    :options="objectArray"
    @search="onSearchEventHandler"
    option-value="id"
    option-text="name"
    placeholder="type to search"
    v-model="selectedObject" />

NOTE: For more detailed usage see the examples folder.

Properties

Name Type Default Description
options Array [ ] Array of objects that will create the select list options
option-value String id The object property used for the value of the select options
option-text String name The object property used for the display text of the select options
v-model Object null Object containing the the selected object
placeholder String search String containing the text to be used as a placeholder

Events

Name Description
search Triggered whenever search text changes. Value is the current search string.
input Triggered whenever an option is selected.
You can’t perform that action at this time.