- 2 themes: Bootstrap 4 (equal styles), Material Design
- autocomplete (you can use custom search)
- keyboard controls (not only through the arrows)
- slots (13) allow content to be changed anywhere
- events (7) will let you know about everything
- props (24) allow you to customize a component in a variety of ways
- loading indicator (helpful for REST requests)
- validation, state of error and success
- support on mobile devices
- disabled and readonly
- smile and large sizes (as in bootstrap)
- ability to set styles for a component
- TypeScript support
Write your suggestions, glad to add.
yarn add vue-cool-select@^2.0.0
or npm install --save vue-cool-select@^2.0.0
- Import and select a theme:
import VueSelect from 'vue-cool-select'
Vue.use(VueSelect, {
theme: 'bootstrap' // or 'material-design'
})
- Use inside another component:
import { CoolSelect } from 'vue-cool-select'
export default {
components: { CoolSelect },
data () {
return {
// simple example of items
items: ['Item 1', 'Item 2', 'Item 3'],
// there will be a selected item
selected: null
}
}
}
- Add to
<template>
:
<cool-select
v-model="selected"
:items="items"
/>
Documentation and examples here.