Skip to content

Latest commit

 

History

History
71 lines (54 loc) · 2.56 KB

README.md

File metadata and controls

71 lines (54 loc) · 2.56 KB

AUR version npm bundle size (minified)

@alfsnd/vue-bootstrap-select

A vue version of bootstrap select

Demo

Edit Vue Bootstrap Select Demo

Install

npm install @alfsnd/vue-bootstrap-select --save

Usage

import VSelect from '@alfsnd/vue-bootstrap-select'

export default {
  name: 'app',
  components: {
    VSelect
  },
  data() {
    return {
      selectedValue: null
    };
  }
}
<template>
  <div id="app">
    <v-select :options="[{value: 1, text: 'Item 1'}, {value: 2, text: 'Item 2'}]" v-model="selectedValue" />
  </div>
</template>

Passing options

The options prop accepts arrays of strings

  <v-select :options="['Item 1', 'Item 2']" />

And arrays of objects

<v-select :options="[{value: 1, text: 'Item 1'}, {value: 2, text: 'Item 2'}]" />

Props

parameter description type default acceptable value
disabled disables select Boolean false
disabledProp allows to disable specific options. If an option has this prop set to a truthy value it will disable the option. String disabled
labelNotFound text displayed when no option is found in the search results String No results matched
labelSearchPlaceholder placeholder text for search input String Search
options list of options Array []
searchable display search input Boolean false
showDefaultOption sets the select title is set as an option Boolean false
textProp the option's prop that is displayed as the option's text String text
valueProp the option's prop that is used to find the selected value String value
filterFunction a function that can be used to do own filtering Function (options, searchValue) => filteredOptions lowercase string comparison