mirrors/vue-select
2
0
Fork 0
mirror of https://github.com/tenrok/vue-select.git synced 2026-05-17 02:29:37 +03:00
Code Activity

bump readme

Browse Source
This commit is contained in:
Jeff Sagal
2016-05-28 14:56:52 -07:00
parent 75c9032d70
commit b64969aee3
1 changed files with 126 additions and 108 deletions
Download Patch File Download Diff File Expand all files Collapse all files
README.md
+126 -108
View File
@@ -4,16 +4,17 @@
#### Features
- No Dependencies
- **Tagging Support (+v.1.1.0)**
- No JS Dependencies
- List Filtering/Searching
- Supports Vuex
- Select Single/Multiple Options
- Bootstrap Friendly Classes
- Excellent Test Coverage
- Bootstrap Friendly Markup
- +90% Test Coverage
#### Upcoming/In Progress
- Tagging (adding options not present in list, see `taggable` branch)
- ~~Tagging (adding options not present in list, see `taggable` branch)~~ **added in v.1.1.0**
- Rich Option Templating
- Asyncronous Option Loading
@@ -48,120 +49,137 @@ export default {
## Parameters
```javascript
/**
* Contains the currently selected value. Very similar to a
* `value` attribute on an <input>. In most cases, you'll want
* to set this as a two-way binding, using :value.sync. However,
* this will not work with Vuex, in which case you'll need to use
* the onChange callback property.
* @type {Object||String||null}
*/
value: {
default: null
},
/**
* Contains the currently selected value. Very similar to a
* `value` attribute on an <input>. In most cases, you'll want
* to set this as a two-way binding, using :value.sync. However,
* this will not work with Vuex, in which case you'll need to use
* the onChange callback property.
* @type {Object||String||null}
*/
value: {
default: null
},
/**
* An array of strings or objects to be used as dropdown choices.
* If you are using an array of objects, vue-select will look for
* a `label` key (ex. [{label: 'This is Foo', value: 'foo'}]). A
* custom label key can be set with the `label` prop.
* @type {Array}
*/
options: {
type: Array,
default() { return [] },
},
/**
* An array of strings or objects to be used as dropdown choices.
* If you are using an array of objects, vue-select will look for
* a `label` key (ex. [{label: 'This is Foo', value: 'foo'}]). A
* custom label key can be set with the `label` prop.
* @type {Object}
*/
options: {
type: Array,
default() { return [] },
},
/**
* Enable/disable filtering the options.
* @type {Boolean}
*/
searchable: {
type: Boolean,
default: true
},
/**
* Sets the max-height property on the dropdown list.
* @deprecated
* @type {String}
*/
maxHeight: {
type: String,
default: '400px'
},
/**
* Equivalent to the `multiple` attribute on a `&lt;select&gt;` input.
* @type {Object}
*/
multiple: {
type: Boolean,
default: false
},
/**
* Enable/disable filtering the options.
* @type {Boolean}
*/
searchable: {
type: Boolean,
default: true
},
/**
* Equivalent to the `placeholder` attribute on an `&lt;input&gt;`.
* @type {Object}
*/
placeholder: {
type: String,
default: ''
},
/**
* Equivalent to the `multiple` attribute on a `<select>` input.
* @type {Object}
*/
multiple: {
type: Boolean,
default: false
},
/**
* Sets a Vue transition property on the `.dropdown-menu`. vue-select
* does not include CSS for transitions, you'll need to add them yourself.
* @type {String}
*/
transition: {
type: String,
default: 'expand'
},
/**
* Equivalent to the `placeholder` attribute on an `<input>`.
* @type {Object}
*/
placeholder: {
type: String,
default: ''
},
/**
* Enables/disables clearing the search text when an option is selected.
* @type {Boolean}
*/
clearSearchOnSelect: {
type: Boolean,
default: true
},
/**
* Sets a Vue transition property on the `.dropdown-menu`. vue-select
* does not include CSS for transitions, you'll need to add them yourself.
* @type {String}
*/
transition: {
type: String,
default: 'expand'
},
/**
* Tells vue-select what key to use when generating option labels when
* `option` is an object.
* @type {Object}
*/
label: {
type: String,
default: 'label'
},
/**
* Enables/disables clearing the search text when an option is selected.
* @type {Boolean}
*/
clearSearchOnSelect: {
type: Boolean,
default: true
},
/**
* An optional callback function that is called each time the selected
* value(s) change. When integrating with Vuex, use this callback to trigger
* an action, rather than using :value.sync to retreive the selected value.
* @type {[type]}
*/
onChange: Function,
/**
* Tells vue-select what key to use when generating option
* labels when each `option` is an object.
* @type {String}
*/
label: {
type: String,
default: 'label'
},
/**
* Enable/disable creating options from searchInput.
* @type {Boolean}
*/
tagable: {
type: Boolean,
default: false
},
/**
* An optional callback function that is called each time the selected
* value(s) change. When integrating with Vuex, use this callback to trigger
* an action, rather than using :value.sync to retreive the selected value.
* @type {Function}
* @default {null}
*/
onChange: Function,
/**
* User defined function for adding Options
* @type {Function}
*/
createOption: {
type: Function,
default: function (value) {
let firstOption = this.options[0]
if (firstOption && typeof firstOption === 'object' ) {
value = {
value
}
value[this.label] = value
}
return value
}
}
/**
* Enable/disable creating options from searchInput.
* @type {Boolean}
*/
taggable: {
type: Boolean,
default: false
},
/**
* When true, newly created tags will be added to
* the options list.
* @type {Boolean}
*/
pushTags: {
type: Boolean,
default: false
},
/**
* User defined function for adding Options
* @type {Function}
*/
createOption: {
type: Function,
default: function (newOption) {
if (typeof this.options[0] === 'object') {
return {[this.label]: newOption}
}
return newOption
}
}
```