diff --git a/examples/docs/en-US/pagination.md b/examples/docs/en-US/pagination.md index d880ed9eb..a67f16633 100644 --- a/examples/docs/en-US/pagination.md +++ b/examples/docs/en-US/pagination.md @@ -51,7 +51,7 @@ Add more modules based on your scenario. @@ -62,7 +62,7 @@ Add more modules based on your scenario. @@ -85,7 +85,7 @@ Add more modules based on your scenario. @@ -109,11 +115,17 @@ Add more modules based on your scenario. ::: @@ -112,12 +118,18 @@ export default { methods: { handleSizeChange(val) { + this.currentPage = val; console.log(`每页 ${val} 条`); }, handleCurrentChange(val) { console.log(`当前页: ${val}`); } }, + data() { + return { + currentPage: 5 + }; + }, mounted() { this.$nextTick(() => { let demos = document.querySelectorAll('.source'); diff --git a/packages/pagination/src/pagination.js b/packages/pagination/src/pagination.js index 799f6a521..cb8310e5f 100644 --- a/packages/pagination/src/pagination.js +++ b/packages/pagination/src/pagination.js @@ -178,11 +178,7 @@ export default { }, handleChange({ target }) { - const oldPage = this.$parent.internalCurrentPage; this.$parent.internalCurrentPage = this.$parent.getValidCurrentPage(target.value); - if (oldPage !== this.$parent.internalCurrentPage) { - this.$parent.$emit('current-change', this.$parent.internalCurrentPage); - } this.oldValue = null; } }, @@ -234,31 +230,17 @@ export default { }, handleCurrentChange(val) { - const oldPage = this.internalCurrentPage; this.internalCurrentPage = this.getValidCurrentPage(val); - if (oldPage !== this.internalCurrentPage) { - this.$emit('current-change', this.internalCurrentPage); - } }, prev() { - const oldPage = this.internalCurrentPage; const newVal = this.internalCurrentPage - 1; this.internalCurrentPage = this.getValidCurrentPage(newVal); - - if (this.internalCurrentPage !== oldPage) { - this.$emit('current-change', this.internalCurrentPage); - } }, next() { - const oldPage = this.internalCurrentPage; const newVal = this.internalCurrentPage + 1; this.internalCurrentPage = this.getValidCurrentPage(newVal); - - if (this.internalCurrentPage !== oldPage) { - this.$emit('current-change', this.internalCurrentPage); - } }, getValidCurrentPage(value) { @@ -299,19 +281,6 @@ export default { }, watch: { - internalPageCount(newVal) { - /* istanbul ignore if */ - const oldPage = this.internalCurrentPage; - if (newVal > 0 && oldPage === 0) { - this.internalCurrentPage = 1; - } else if (oldPage > newVal) { - this.internalCurrentPage = newVal === 0 ? 1 : newVal; - } - if (oldPage !== this.internalCurrentPage) { - this.$emit('current-change', this.internalCurrentPage); - } - }, - currentPage: { immediate: true, handler(val) { @@ -339,7 +308,22 @@ export default { if (newVal !== undefined) { this.$nextTick(() => { this.internalCurrentPage = newVal; + if (oldVal !== newVal) { + this.$emit('current-change', this.internalCurrentPage); + } }); + } else { + this.$emit('current-change', this.internalCurrentPage); + } + }, + + internalPageCount(newVal) { + /* istanbul ignore if */ + const oldPage = this.internalCurrentPage; + if (newVal > 0 && oldPage === 0) { + this.internalCurrentPage = 1; + } else if (oldPage > newVal) { + this.internalCurrentPage = newVal === 0 ? 1 : newVal; } } } diff --git a/test/unit/specs/pagination.spec.js b/test/unit/specs/pagination.spec.js index 36dd7d4e1..9939138e8 100644 --- a/test/unit/specs/pagination.spec.js +++ b/test/unit/specs/pagination.spec.js @@ -93,6 +93,42 @@ describe('Pagination', () => { expect(vm.$el.querySelector('li.number.active')).to.have.property('textContent').to.equal('3'); }); + it('set currentPage & total', (done) => { + vm = createVue({ + template: ` + + `, + + methods: { + handleChange(val) { + this.currentPage = val; + this.page = val; + }, + resetTotal() { + this.total = 30; + this.currentPage = 1; + } + }, + + data() { + return { + currentPage: 10 + }; + } + }, true); + + expect(vm.$el.querySelector('li.number.active')).to.have.property('textContent').to.equal('10'); + vm.resetTotal(); + setTimeout(() => { + expect(vm.$el.querySelector('li.number.active')).to.have.property('textContent').to.equal('1'); + done(); + }, 50); + }); + it('pageSizes', () => { vm = createTest(Pagination, { pageSizes: [10, 15, 35, 50], @@ -126,7 +162,7 @@ describe('Pagination', () => { expect(vm.$el.textContent).to.empty; }); - it('jumper: change value', () => { + it('jumper: change value', (done) => { vm = createVue({ template: ` { input.focus(); input.value = -1; triggerEvent(input, 'change'); - expect(vm.page).to.equal(1); + setTimeout(() => { + expect(vm.page).to.equal(1); - input.value = 10000; - triggerEvent(input, 'change'); - expect(vm.page).to.equal(10); + input.value = 10000; + triggerEvent(input, 'change'); + setTimeout(() => { + expect(vm.page).to.equal(10); - input.value = '我好帅'; - triggerEvent(input, 'change'); - expect(vm.page).to.equal(1); + input.value = '我好帅'; + triggerEvent(input, 'change'); + setTimeout(() => { + expect(vm.page).to.equal(1); + done(); + }, 50); + }, 50); + }, 50); }); - it('event:current-change', () => { + it('event:current-change', (done) => { vm = createVue({ template: ` { } prev.click(); - expect(vm.change).to.true; + setTimeout(() => { + expect(vm.change).to.true; + done(); + }, 50); }); it('event:size-change', done => { @@ -200,9 +246,10 @@ describe('Pagination', () => { data() { return { trigger: false }; } - }); + }, true); expect(vm.trigger).to.false; + setTimeout(_ => { vm.$el.querySelectorAll('li.el-select-dropdown__item')[1].click(); setTimeout(_ => {