diff --git a/src/components/select/select.vue b/src/components/select/select.vue index 3d953c90..5a59ff45 100644 --- a/src/components/select/select.vue +++ b/src/components/select/select.vue @@ -50,6 +50,7 @@ import { oneOf, findComponentDownward } from '../../utils/assist'; import Emitter from '../../mixins/emitter'; import Locale from '../../mixins/locale'; + import {debounce} from './utils'; const prefixCls = 'ivu-select'; @@ -623,6 +624,18 @@ this.broadcast('iOption', 'on-query-change', val); } }, + debouncedAppendRemove: debounce(function(){ + if (!this.remote) { + this.modelToQuery(); + this.$nextTick(() => this.broadcastQuery('')); + } else { + this.findChild((child) => { + child.selected = this.multiple ? this.model.indexOf(child.value) > -1 : this.model === child.value; + }); + } + this.slotChange(); + this.updateOptions(true, true); + }), // 处理 remote 初始值 updateLabel () { if (this.remote) { @@ -656,34 +669,8 @@ this.updateOptions(true); document.addEventListener('keydown', this.handleKeydown); - this.$on('append', () => { - if (!this.remote) { - this.modelToQuery(); - this.$nextTick(() => { - this.broadcastQuery(''); - }); - } else { - this.findChild(child => { - child.selected = this.multiple ? this.model.indexOf(child.value) > -1 : this.model === child.value; - }); - } - this.slotChange(); - this.updateOptions(true, true); - }); - this.$on('remove', () => { - if (!this.remote) { - this.modelToQuery(); - this.$nextTick(() => { - this.broadcastQuery(''); - }); - } else { - this.findChild(child => { - child.selected = this.multiple ? this.model.indexOf(child.value) > -1 : this.model === child.value; - }); - } - this.slotChange(); - this.updateOptions(true, true); - }); + this.$on('append', this.debouncedAppendRemove); + this.$on('remove', this.debouncedAppendRemove); this.$on('on-select-selected', (value) => { if (this.model === value) { diff --git a/src/components/select/utils.js b/src/components/select/utils.js new file mode 100644 index 00000000..b589b496 --- /dev/null +++ b/src/components/select/utils.js @@ -0,0 +1,14 @@ +export function debounce(fn) { + let waiting; + return function() { + if (waiting) return; + waiting = true; + const context = this, + args = arguments; + const later = function() { + waiting = false; + fn.apply(context, args); + }; + this.$nextTick(later); + }; +} diff --git a/test/unit/specs/select.spec.js b/test/unit/specs/select.spec.js index feac6eae..4b70a44e 100644 --- a/test/unit/specs/select.spec.js +++ b/test/unit/specs/select.spec.js @@ -156,7 +156,7 @@ describe('Select.vue', () => { }); describe('Performance tests', () => { - xit('should handle big numbers of options', done => { + it('should handle big numbers of options', done => { const manyLaterOptions = Array.apply(null, Array(200)).map((_, i) => { return { value: i + 1,