diff --git a/src/picker/index.js b/src/picker/index.js index 07d88de91..3ac2b7df1 100644 --- a/src/picker/index.js +++ b/src/picker/index.js @@ -176,7 +176,14 @@ export default createComponent({ // set column option index by column index setColumnIndex(columnIndex, optionIndex) { const column = this.getColumn(columnIndex); - column && column.setIndex(optionIndex); + + if (column) { + column.setIndex(optionIndex); + + if (this.dataType === 'cascade') { + this.onCascadeChange(columnIndex); + } + } }, // @exposed-api diff --git a/src/picker/test/cascade.spec.js b/src/picker/test/cascade.spec.js index 02bd3966d..5bc60a418 100644 --- a/src/picker/test/cascade.spec.js +++ b/src/picker/test/cascade.spec.js @@ -1,59 +1,84 @@ import Picker from '..'; import { mount, triggerDrag } from '../../../test'; -import { cascadeColumns } from '../demo/data'; + +const COLUMNS = [ + { + text: 'A1', + children: [ + { + text: 'B1', + children: [{ text: 'C1' }, { text: 'C2' }], + }, + { + text: 'B2', + children: [{ text: 'C3' }, { text: 'C4' }], + }, + ], + }, + { + text: 'A2', + children: [ + { + text: 'B3', + children: [{ text: 'C5' }, { text: 'C6' }], + }, + { + text: 'B4', + children: [{ text: 'C7' }, { text: 'C8' }], + }, + ], + }, +]; test('cascade columns', () => { const wrapper = mount(Picker, { propsData: { showToolbar: true, - columns: cascadeColumns['en-US'], + columns: COLUMNS, }, }); wrapper.find('.van-picker__confirm').trigger('click'); - expect(wrapper.emitted('confirm')[0][0]).toEqual([ - 'Zhejiang', - 'Hangzhou', - 'Xihu', - ]); + expect(wrapper.emitted('confirm')[0][0]).toEqual(['A1', 'B1', 'C1']); triggerDrag(wrapper.find('.van-picker-column'), 0, -100); wrapper.find('.van-picker-column ul').trigger('transitionend'); - expect(wrapper.emitted('change')[0][1]).toEqual([ - 'Fujian', - 'Fuzhou', - 'Gulou', - ]); + expect(wrapper.emitted('change')[0][1]).toEqual(['A2', 'B3', 'C5']); wrapper.find('.van-picker__confirm').trigger('click'); - expect(wrapper.emitted('confirm')[1][0]).toEqual([ - 'Fujian', - 'Fuzhou', - 'Gulou', - ]); + expect(wrapper.emitted('confirm')[1][0]).toEqual(['A2', 'B3', 'C5']); }); test('setColumnValue of cascade columns', () => { const wrapper = mount(Picker, { propsData: { showToolbar: true, - columns: cascadeColumns['en-US'], + columns: COLUMNS, }, }); - wrapper.vm.setColumnValue(0, 'Fujian'); + wrapper.vm.setColumnValue(0, 'A2'); wrapper.find('.van-picker__confirm').trigger('click'); - expect(wrapper.emitted('confirm')[0][0]).toEqual([ - 'Fujian', - 'Fuzhou', - 'Gulou', - ]); + expect(wrapper.emitted('confirm')[0][0]).toEqual(['A2', 'B3', 'C5']); - wrapper.vm.setColumnValue(1, 'Xiamen'); + wrapper.vm.setColumnValue(1, 'B4'); wrapper.find('.van-picker__confirm').trigger('click'); - expect(wrapper.emitted('confirm')[1][0]).toEqual([ - 'Fujian', - 'Xiamen', - 'Siming', - ]); + expect(wrapper.emitted('confirm')[1][0]).toEqual(['A2', 'B4', 'C7']); +}); + +test('setColumnIndex of cascade columns', () => { + const wrapper = mount(Picker, { + propsData: { + showToolbar: true, + columns: COLUMNS, + }, + }); + + wrapper.vm.setColumnIndex(0, 1); + wrapper.find('.van-picker__confirm').trigger('click'); + expect(wrapper.emitted('confirm')[0][0]).toEqual(['A2', 'B3', 'C5']); + + wrapper.vm.setColumnIndex(1, 1); + wrapper.find('.van-picker__confirm').trigger('click'); + expect(wrapper.emitted('confirm')[1][0]).toEqual(['A2', 'B4', 'C7']); });