diff --git a/dev.html b/dev.html
index d0eafd0..bc01d7a 100644
--- a/dev.html
+++ b/dev.html
@@ -34,6 +34,7 @@
+
diff --git a/src/components/Select.vue b/src/components/Select.vue
index 56e35db..ef65e60 100644
--- a/src/components/Select.vue
+++ b/src/components/Select.vue
@@ -390,6 +390,16 @@
default: true
},
+ /**
+ * Allows user to choose to close the select dropdown when an option is selected.
+ * set to true when multiple=true to close the dropdown between each selection
+ * @type {Boolean}
+ */
+ closeOnMultiSelect: {
+ type: Boolean,
+ default: false
+ },
+
/**
* Tells vue-select what key to use when generating option
* labels when each `option` is an object.
@@ -625,7 +635,12 @@
* @return {void}
*/
onAfterSelect(option) {
- if (!this.multiple) {
+ if (this.multiple) {
+ if (this.closeOnMultiSelect) {
+ this.open = !this.open
+ this.$refs.search.blur()
+ }
+ } else {
this.open = !this.open
this.$refs.search.blur()
}
diff --git a/test/unit/specs/Select.spec.js b/test/unit/specs/Select.spec.js
index bd5cff4..65f7421 100644
--- a/test/unit/specs/Select.spec.js
+++ b/test/unit/specs/Select.spec.js
@@ -351,6 +351,26 @@ describe('Select.vue', () => {
})
})
+ it('can close the dropdown when the el is clicked, multiple is true, and multipleCloseOnSelect option is true', (done) => {
+ const vm = new Vue({
+ template: '
',
+ components: {vSelect},
+ data: {
+ value: [],
+ options: ['one', 'two', 'three']
+ }
+ }).$mount()
+
+ vm.$children[0].open = true
+ vm.$refs.select.select('one')
+
+ Vue.nextTick(() => {
+ expect(vm.$children[0].open).toEqual(false)
+ done()
+ })
+ })
+
+
it('should close the dropdown on search blur', () => {
const vm = new Vue({
template: '
',