diff --git a/src/components/Select.vue b/src/components/Select.vue index 472b8a4..1bb43ac 100644 --- a/src/components/Select.vue +++ b/src/components/Select.vue @@ -488,8 +488,7 @@ search: '', open: false, mutableValue: null, - mutableOptions: [], - mutableLoading: false + mutableOptions: [] } }, @@ -765,7 +764,7 @@ * @return {Boolean} True if open */ dropdownOpen() { - return this.noDrop ? false : this.open + return this.noDrop ? false : this.open && !this.mutableLoading }, /** diff --git a/src/mixins/ajax.js b/src/mixins/ajax.js index b0c1787..b897053 100644 --- a/src/mixins/ajax.js +++ b/src/mixins/ajax.js @@ -27,6 +27,12 @@ module.exports = { } }, + data() { + return { + mutableLoading: false + } + }, + watch: { /** * If a callback & search text has been provided, @@ -38,6 +44,14 @@ module.exports = { this.$emit('search', this.search, this.toggleLoading) } }, + /** + * Sync the loading prop with the internal + * mutable loading value. + * @param val + */ + loading(val) { + this.mutableLoading = val + } }, methods: { diff --git a/test/unit/specs/Select.spec.js b/test/unit/specs/Select.spec.js index 5abe705..bd5cff4 100644 --- a/test/unit/specs/Select.spec.js +++ b/test/unit/specs/Select.spec.js @@ -1058,6 +1058,18 @@ describe('Select.vue', () => { done() }) }) + + it('will sync mutable loading with the loading prop', (done) => { + const vm = new Vue({ + template: '
', + data: {loading:false} + }).$mount() + vm.loading = true + Vue.nextTick(() => { + expect(vm.$refs.select.mutableLoading).toEqual(true) + done() + }) + }) }) describe('Reset on options change', () => {