diff --git a/packages/vant/src/address-edit/AddressEdit.tsx b/packages/vant/src/address-edit/AddressEdit.tsx index f1681f999..36258f6cd 100644 --- a/packages/vant/src/address-edit/AddressEdit.tsx +++ b/packages/vant/src/address-edit/AddressEdit.tsx @@ -102,11 +102,11 @@ export default defineComponent({ 'save', 'focus', 'delete', - 'click-area', - 'change-area', - 'change-detail', - 'select-search', - 'change-default', + 'clickArea', + 'changeArea', + 'changeDetail', + 'selectSearch', + 'changeDefault', ], setup(props, { emit, slots }) { @@ -188,7 +188,7 @@ export default defineComponent({ const onChangeDetail = (val: string) => { data.addressDetail = val; - emit('change-detail', val); + emit('changeDetail', val); }; const onAreaConfirm = (values: AreaColumnOption[]) => { @@ -199,7 +199,7 @@ export default defineComponent({ } else { showAreaPopup.value = false; assignAreaValues(); - emit('change-area', values); + emit('changeArea', values); } }; @@ -235,7 +235,7 @@ export default defineComponent({ emit('change-default', event)} + onChange={(event) => emit('changeDefault', event)} /> ), }; @@ -309,7 +309,7 @@ export default defineComponent({ placeholder={props.areaPlaceholder || t('area')} onFocus={() => onFocus('areaCode')} onClick={() => { - emit('click-area'); + emit('clickArea'); showAreaPopup.value = !disableArea; }} /> @@ -325,7 +325,7 @@ export default defineComponent({ onBlur={onDetailBlur} onFocus={() => onFocus('addressDetail')} onInput={onChangeDetail} - onSelect-search={(event: Event) => emit('select-search', event)} + onSelectSearch={(event: Event) => emit('selectSearch', event)} /> {props.showPostal && ( (); @@ -37,7 +37,7 @@ export default defineComponent({ props.focused && props.searchResult && props.showSearchResult; const onSelect = (express: AddressEditSearchItem) => { - emit('select-search', express); + emit('selectSearch', express); emit('input', `${express.address || ''} ${express.name || ''}`.trim()); }; diff --git a/packages/vant/src/address-edit/test/index.legacy.js b/packages/vant/src/address-edit/test/index.legacy.js index 492718977..f44e7adf8 100644 --- a/packages/vant/src/address-edit/test/index.legacy.js +++ b/packages/vant/src/address-edit/test/index.legacy.js @@ -112,13 +112,13 @@ test('should valid postal code and render error message correctly', async () => expect(fields[4].html()).toMatchSnapshot(); }); -test('should emit change-detail event after changing address detail', () => { +test('should emit changeDetail event after changing address detail', () => { const wrapper = mount(AddressEdit); const field = wrapper.findAll('.van-field__control')[3]; field.element.value = '123'; field.trigger('input'); - expect(wrapper.emitted('change-detail')[0][0]).toEqual('123'); + expect(wrapper.emitted('changeDetail')[0][0]).toEqual('123'); }); test('should return current areas after calling getArea method', () => { @@ -204,7 +204,7 @@ test('should update address detail after calling the setAddressDetail method', a expect(textarea.element.value).toEqual('test'); }); -test('should emit click-area event after clicking the area field', () => { +test('should emit clickArea event after clicking the area field', () => { const wrapper = mount(AddressEdit, { props: { disableArea: true, @@ -213,7 +213,7 @@ test('should emit click-area event after clicking the area field', () => { const field = wrapper.findAll('.van-field')[2]; field.trigger('click'); - expect(wrapper.emitted('click-area')[0]).toBeTruthy(); + expect(wrapper.emitted('clickArea')[0]).toBeTruthy(); }); test('should limit tel maxlength when using tel-maxlength prop', () => { diff --git a/packages/vant/src/address-list/AddressList.tsx b/packages/vant/src/address-list/AddressList.tsx index 3b82d1099..2b9098b1f 100644 --- a/packages/vant/src/address-list/AddressList.tsx +++ b/packages/vant/src/address-list/AddressList.tsx @@ -36,9 +36,9 @@ export default defineComponent({ 'add', 'edit', 'select', - 'click-item', - 'edit-disabled', - 'select-disabled', + 'clickItem', + 'editDisabled', + 'selectDisabled', 'update:modelValue', ], @@ -49,12 +49,12 @@ export default defineComponent({ disabled?: boolean ) => { const onEdit = () => - emit(disabled ? 'edit-disabled' : 'edit', item, index); + emit(disabled ? 'editDisabled' : 'edit', item, index); - const onClick = () => emit('click-item', item, index); + const onClick = () => emit('clickItem', item, index); const onSelect = () => { - emit(disabled ? 'select-disabled' : 'select', item, index); + emit(disabled ? 'selectDisabled' : 'select', item, index); if (!disabled) { emit('update:modelValue', item.id); diff --git a/packages/vant/src/address-list/test/index.spec.ts b/packages/vant/src/address-list/test/index.spec.ts index 83542b383..b792976bd 100644 --- a/packages/vant/src/address-list/test/index.spec.ts +++ b/packages/vant/src/address-list/test/index.spec.ts @@ -39,7 +39,7 @@ test('should emit select event after clicking radio icon', () => { expect(wrapper.emitted('select')![0]).toEqual([list[0], 0]); }); -test('should emit click-item event when item is clicked', () => { +test('should emit clickItem event when item is clicked', () => { const wrapper = mount(AddressList, { props: { list, @@ -48,7 +48,7 @@ test('should emit click-item event when item is clicked', () => { wrapper.find('.van-address-item').trigger('click'); - expect(wrapper.emitted('click-item')![0]).toEqual([list[0], 0]); + expect(wrapper.emitted('clickItem')![0]).toEqual([list[0], 0]); }); test('should render tag slot correctly', () => { diff --git a/packages/vant/src/calendar/Calendar.tsx b/packages/vant/src/calendar/Calendar.tsx index 71fa70850..ef2fe521f 100644 --- a/packages/vant/src/calendar/Calendar.tsx +++ b/packages/vant/src/calendar/Calendar.tsx @@ -111,10 +111,10 @@ export default defineComponent({ 'select', 'confirm', 'unselect', - 'month-show', - 'over-range', + 'monthShow', + 'overRange', 'update:show', - 'click-subtitle', + 'clickSubtitle', ], setup(props, { emit, slots }) { @@ -243,7 +243,7 @@ export default defineComponent({ if (!monthRefs.value[i].showed) { monthRefs.value[i].showed = true; - emit('month-show', { + emit('monthShow', { date: month.date, title: month.getTitle(), }); @@ -323,7 +323,7 @@ export default defineComponent({ if (showRangePrompt) { Toast(rangePrompt || t('rangePrompt', maxRange)); } - emit('over-range'); + emit('overRange'); return false; } @@ -522,9 +522,7 @@ export default defineComponent({ showTitle={props.showTitle} showSubtitle={props.showSubtitle} firstDayOfWeek={dayOffset.value} - onClick-subtitle={(event: MouseEvent) => - emit('click-subtitle', event) - } + onClickSubtitle={(event: MouseEvent) => emit('clickSubtitle', event)} />
{months.value.map(renderMonth)} diff --git a/packages/vant/src/calendar/CalendarHeader.tsx b/packages/vant/src/calendar/CalendarHeader.tsx index 7cca6aef6..c38e4eeb8 100644 --- a/packages/vant/src/calendar/CalendarHeader.tsx +++ b/packages/vant/src/calendar/CalendarHeader.tsx @@ -15,7 +15,7 @@ export default defineComponent({ firstDayOfWeek: Number, }, - emits: ['click-subtitle'], + emits: ['clickSubtitle'], setup(props, { slots, emit }) { const renderTitle = () => { @@ -26,8 +26,7 @@ export default defineComponent({ } }; - const onClickSubtitle = (event: MouseEvent) => - emit('click-subtitle', event); + const onClickSubtitle = (event: MouseEvent) => emit('clickSubtitle', event); const renderSubtitle = () => { if (props.showSubtitle) { diff --git a/packages/vant/src/calendar/CalendarMonth.tsx b/packages/vant/src/calendar/CalendarMonth.tsx index b7f1e19a3..f52448da1 100644 --- a/packages/vant/src/calendar/CalendarMonth.tsx +++ b/packages/vant/src/calendar/CalendarMonth.tsx @@ -62,7 +62,7 @@ export default defineComponent({ props: calendarMonthProps, - emits: ['click', 'update-height'], + emits: ['click'], setup(props, { emit, slots }) { const [visible, setVisible] = useToggle(); diff --git a/packages/vant/src/calendar/test/index.spec.ts b/packages/vant/src/calendar/test/index.spec.ts index 2ae72fb22..7e536e2c6 100644 --- a/packages/vant/src/calendar/test/index.spec.ts +++ b/packages/vant/src/calendar/test/index.spec.ts @@ -555,7 +555,7 @@ test('should render top-info and bottom-info slot correctly', async () => { expect(wrapper.find('.van-calendar__day').html()).toMatchSnapshot(); }); -test('should emit click-subtitle event when clicking the subtitle', async () => { +test('should emit clickSubtitle event when clicking the subtitle', async () => { const wrapper = mount(Calendar, { props: { minDate, @@ -567,7 +567,7 @@ test('should emit click-subtitle event when clicking the subtitle', async () => await later(); wrapper.find('.van-calendar__header-subtitle').trigger('click'); - expect(wrapper.emitted('click-subtitle')).toBeTruthy(); + expect(wrapper.emitted('clickSubtitle')).toBeTruthy(); }); test('should render confirm-text slot correctly', async () => { diff --git a/packages/vant/src/calendar/test/prop.spec.ts b/packages/vant/src/calendar/test/prop.spec.ts index 5e9002996..434ddcd08 100644 --- a/packages/vant/src/calendar/test/prop.spec.ts +++ b/packages/vant/src/calendar/test/prop.spec.ts @@ -167,7 +167,7 @@ test('lazy-render prop', () => { expect(wrapper.html()).toMatchSnapshot(); }); -test('month-show event', async () => { +test('monthShow event', async () => { const wrapper = mount(Calendar, { props: { show: true, @@ -175,7 +175,7 @@ test('month-show event', async () => { }); await later(200); - expect(wrapper.emitted('month-show')).toBeTruthy(); + expect(wrapper.emitted('monthShow')).toBeTruthy(); }); test('first day of week', async () => { @@ -248,7 +248,7 @@ test('should disabled prompt when using show-range-prompt prop', async () => { expect(document.querySelector('.van-toast')).toBeFalsy(); }); -test('should emit over-range when exceeded max range', async () => { +test('should emit overRange when exceeded max range', async () => { const onOverRange = jest.fn(); const wrapper = mount(Calendar, { props: { diff --git a/packages/vant/src/card/Card.tsx b/packages/vant/src/card/Card.tsx index 291683e55..4fbb5f0be 100644 --- a/packages/vant/src/card/Card.tsx +++ b/packages/vant/src/card/Card.tsx @@ -30,7 +30,7 @@ export default defineComponent({ props: cardProps, - emits: ['click-thumb'], + emits: ['clickThumb'], setup(props, { slots, emit }) { const renderTitle = () => { @@ -85,7 +85,7 @@ export default defineComponent({ emit('click-thumb', event)} + onClick={(event: MouseEvent) => emit('clickThumb', event)} > {renderThumbImage()} {renderThumbTag()} diff --git a/packages/vant/src/card/test/index.spec.ts b/packages/vant/src/card/test/index.spec.ts index 9a56ff6f3..a2e81e898 100644 --- a/packages/vant/src/card/test/index.spec.ts +++ b/packages/vant/src/card/test/index.spec.ts @@ -12,7 +12,7 @@ test('should emit click event after clicked', () => { expect(onClick).toHaveBeenCalledTimes(1); }); -test('should emit click-thumb event after clicking thumb', () => { +test('should emit clickThumb event after clicking thumb', () => { const wrapper = mount(Card, { props: { thumb: 'xx', @@ -20,7 +20,7 @@ test('should emit click-thumb event after clicking thumb', () => { }); wrapper.find('.van-card__thumb').trigger('click'); - expect(wrapper.emitted('click-thumb')!).toHaveLength(1); + expect(wrapper.emitted('clickThumb')!).toHaveLength(1); }); test('should render price and num slot correctly', () => { diff --git a/packages/vant/src/cascader/Cascader.tsx b/packages/vant/src/cascader/Cascader.tsx index b5949dc72..20a70e967 100644 --- a/packages/vant/src/cascader/Cascader.tsx +++ b/packages/vant/src/cascader/Cascader.tsx @@ -47,7 +47,7 @@ export default defineComponent({ props: cascaderProps, - emits: ['close', 'change', 'finish', 'click-tab', 'update:modelValue'], + emits: ['close', 'change', 'finish', 'clickTab', 'update:modelValue'], setup(props, { slots, emit }) { const tabs = ref([]); @@ -184,7 +184,7 @@ export default defineComponent({ const onClose = () => emit('close'); const onClickTab = ({ name, title }: TabsClickTabEventParams) => - emit('click-tab', name, title); + emit('clickTab', name, title); const renderHeader = () => props.showHeader ? ( @@ -276,7 +276,7 @@ export default defineComponent({ class={bem('tabs')} color={props.activeColor} swipeable={props.swipeable} - onClick-tab={onClickTab} + onClickTab={onClickTab} > {tabs.value.map(renderTab)} diff --git a/packages/vant/src/cascader/test/index.spec.ts b/packages/vant/src/cascader/test/index.spec.ts index e7723cf14..41089f163 100644 --- a/packages/vant/src/cascader/test/index.spec.ts +++ b/packages/vant/src/cascader/test/index.spec.ts @@ -190,7 +190,7 @@ test('should allow to custom field names', async () => { ]); }); -test('should emit click-tab event when a tab is clicked', async () => { +test('should emit clickTab event when a tab is clicked', async () => { const wrapper = mount(Cascader, { props: { options, @@ -209,10 +209,10 @@ test('should emit click-tab event when a tab is clicked', async () => { const tabs = wrapper.findAll('.van-tab'); tabs[0].trigger('click'); - expect(wrapper.emitted('click-tab')![0]).toEqual([0, options[0].text]); + expect(wrapper.emitted('clickTab')![0]).toEqual([0, options[0].text]); tabs[1].trigger('click'); - expect(wrapper.emitted('click-tab')![1]).toEqual([ + expect(wrapper.emitted('clickTab')![1]).toEqual([ 1, options[0].children[0].text, ]); diff --git a/packages/vant/src/contact-edit/ContactEdit.tsx b/packages/vant/src/contact-edit/ContactEdit.tsx index 83afcefb2..0ddd5f4bf 100644 --- a/packages/vant/src/contact-edit/ContactEdit.tsx +++ b/packages/vant/src/contact-edit/ContactEdit.tsx @@ -52,7 +52,7 @@ export default defineComponent({ props: contactEditProps, - emits: ['save', 'delete', 'change-default'], + emits: ['save', 'delete', 'changeDefault'], setup(props, { emit }) { const contact = reactive(extend({}, DEFAULT_CONTACT, props.contactInfo)); @@ -93,7 +93,7 @@ export default defineComponent({ emit('change-default', checked)} + onChange={(checked: boolean) => emit('changeDefault', checked)} /> ); diff --git a/packages/vant/src/field/Field.tsx b/packages/vant/src/field/Field.tsx index 69635daf1..f6ddbafaa 100644 --- a/packages/vant/src/field/Field.tsx +++ b/packages/vant/src/field/Field.tsx @@ -124,9 +124,9 @@ export default defineComponent({ 'focus', 'clear', 'keypress', - 'click-input', - 'click-left-icon', - 'click-right-icon', + 'clickInput', + 'clickLeftIcon', + 'clickRightIcon', 'update:modelValue', ], @@ -332,13 +332,12 @@ export default defineComponent({ resetScroll(); }; - const onClickInput = (event: MouseEvent) => emit('click-input', event); + const onClickInput = (event: MouseEvent) => emit('clickInput', event); - const onClickLeftIcon = (event: MouseEvent) => - emit('click-left-icon', event); + const onClickLeftIcon = (event: MouseEvent) => emit('clickLeftIcon', event); const onClickRightIcon = (event: MouseEvent) => - emit('click-right-icon', event); + emit('clickRightIcon', event); const onClear = (event: MouseEvent) => { preventDefault(event); diff --git a/packages/vant/src/field/test/index.spec.js b/packages/vant/src/field/test/index.spec.js index 8a9258124..7f8dc8fc3 100644 --- a/packages/vant/src/field/test/index.spec.js +++ b/packages/vant/src/field/test/index.spec.js @@ -10,13 +10,13 @@ test('should emit "update:modelValue" event when after inputting', () => { expect(wrapper.emitted('update:modelValue')[0][0]).toEqual('1'); }); -test('should emit click-input event when input is clicked', () => { +test('should emit clickInput event when input is clicked', () => { const wrapper = mount(Field); wrapper.find('input').trigger('click'); - expect(wrapper.emitted('click-input')[0][0]).toBeTruthy(); + expect(wrapper.emitted('clickInput')[0][0]).toBeTruthy(); }); -test('should emit click-input event when using input slot', () => { +test('should emit clickInput event when using input slot', () => { const wrapper = mount(Field, { slots: { input: () => 'Custom Input', @@ -24,10 +24,10 @@ test('should emit click-input event when using input slot', () => { }); wrapper.find('.van-field__control').trigger('click'); - expect(wrapper.emitted('click-input')[0][0]).toBeTruthy(); + expect(wrapper.emitted('clickInput')[0][0]).toBeTruthy(); }); -test('should emit click-left-icon event when left icon is clicked', () => { +test('should emit clickLeftIcon event when left icon is clicked', () => { const wrapper = mount(Field, { props: { leftIcon: 'contact', @@ -35,10 +35,10 @@ test('should emit click-left-icon event when left icon is clicked', () => { }); wrapper.find('.van-field__left-icon').trigger('click'); - expect(wrapper.emitted('click-left-icon')[0][0]).toBeTruthy(); + expect(wrapper.emitted('clickLeftIcon')[0][0]).toBeTruthy(); }); -test('should emit click-right-icon event when right icon is clicked', () => { +test('should emit clickRightIcon event when right icon is clicked', () => { const wrapper = mount(Field, { props: { rightIcon: 'search', @@ -46,7 +46,7 @@ test('should emit click-right-icon event when right icon is clicked', () => { }); wrapper.find('.van-field__right-icon').trigger('click'); - expect(wrapper.emitted('click-right-icon')[0][0]).toBeTruthy(); + expect(wrapper.emitted('clickRightIcon')[0][0]).toBeTruthy(); }); test('should format input value when type is number', () => { diff --git a/packages/vant/src/nav-bar/NavBar.tsx b/packages/vant/src/nav-bar/NavBar.tsx index e8a867e4a..0370c8de5 100644 --- a/packages/vant/src/nav-bar/NavBar.tsx +++ b/packages/vant/src/nav-bar/NavBar.tsx @@ -42,14 +42,14 @@ export default defineComponent({ props: navBarProps, - emits: ['click-left', 'click-right'], + emits: ['clickLeft', 'clickRight'], setup(props, { emit, slots }) { const navBarRef = ref(); const renderPlaceholder = usePlaceholder(navBarRef, bem); - const onClickLeft = (event: MouseEvent) => emit('click-left', event); - const onClickRight = (event: MouseEvent) => emit('click-right', event); + const onClickLeft = (event: MouseEvent) => emit('clickLeft', event); + const onClickRight = (event: MouseEvent) => emit('clickRight', event); const renderLeft = () => { if (slots.left) { diff --git a/packages/vant/src/nav-bar/test/index.spec.ts b/packages/vant/src/nav-bar/test/index.spec.ts index 8d5cf699b..267d41d50 100644 --- a/packages/vant/src/nav-bar/test/index.spec.ts +++ b/packages/vant/src/nav-bar/test/index.spec.ts @@ -45,7 +45,7 @@ test('should render placeholder element when using placeholder prop', async () = restore(); }); -test('should emit click-left event when clicking left text', () => { +test('should emit clickLeft event when clicking left text', () => { const wrapper = mount(NavBar, { props: { leftText: 'left', @@ -53,10 +53,10 @@ test('should emit click-left event when clicking left text', () => { }); wrapper.find('.van-nav-bar__left').trigger('click'); - expect(wrapper.emitted('click-left')).toBeTruthy(); + expect(wrapper.emitted('clickLeft')).toBeTruthy(); }); -test('should emit click-right event when clicking right text', () => { +test('should emit clickRight event when clicking right text', () => { const wrapper = mount(NavBar, { props: { rightText: 'right', @@ -64,7 +64,7 @@ test('should emit click-right event when clicking right text', () => { }); wrapper.find('.van-nav-bar__right').trigger('click'); - expect(wrapper.emitted('click-right')).toBeTruthy(); + expect(wrapper.emitted('clickRight')).toBeTruthy(); }); test('should have safe-area-inset-top class when using safe-area-inset-top prop', () => { diff --git a/packages/vant/src/popover/test/index.spec.tsx b/packages/vant/src/popover/test/index.spec.tsx index 953b497a2..6d5e61f1b 100644 --- a/packages/vant/src/popover/test/index.spec.tsx +++ b/packages/vant/src/popover/test/index.spec.tsx @@ -147,7 +147,7 @@ test('should close popover when touch outside content', async () => { expect(wrapper.emitted('update:show')![0]).toEqual([false]); }); -test('should emit click-overlay event when overlay is clicked', () => { +test('should emit clickOverlay event when overlay is clicked', () => { const onClickOverlay = jest.fn(); const wrapper = mount(Popover, { props: { diff --git a/packages/vant/src/popup/Popup.tsx b/packages/vant/src/popup/Popup.tsx index 78efca23f..759aaad71 100644 --- a/packages/vant/src/popup/Popup.tsx +++ b/packages/vant/src/popup/Popup.tsx @@ -69,8 +69,8 @@ export default defineComponent({ 'opened', 'closed', 'update:show', - 'click-overlay', - 'click-close-icon', + 'clickOverlay', + 'clickCloseIcon', ], setup(props, { emit, attrs, slots }) { @@ -124,7 +124,7 @@ export default defineComponent({ }; const onClickOverlay = (event: MouseEvent) => { - emit('click-overlay', event); + emit('clickOverlay', event); if (props.closeOnClickOverlay) { close(); @@ -148,7 +148,7 @@ export default defineComponent({ }; const onClickCloseIcon = (event: MouseEvent) => { - emit('click-close-icon', event); + emit('clickCloseIcon', event); close(); }; diff --git a/packages/vant/src/popup/test/index.spec.jsx b/packages/vant/src/popup/test/index.spec.jsx index 85ef77403..763aa2411 100644 --- a/packages/vant/src/popup/test/index.spec.jsx +++ b/packages/vant/src/popup/test/index.spec.jsx @@ -93,7 +93,7 @@ test('should not render overlay when overlay prop is false', () => { expect(wrapper.find('.van-overlay').exists()).toBeFalsy(); }); -test('should emit click-overlay event when overlay is clicked', async () => { +test('should emit clickOverlay event when overlay is clicked', async () => { wrapper = mount(Popup, { props: { show: true, @@ -101,7 +101,7 @@ test('should emit click-overlay event when overlay is clicked', async () => { }); const overlay = wrapper.find('.van-overlay'); overlay.trigger('click'); - expect(wrapper.emitted('click-overlay')).toHaveLength(1); + expect(wrapper.emitted('clickOverlay')).toHaveLength(1); }); test('should emit open event when show prop is set to true', async () => { @@ -182,7 +182,7 @@ test('should render close icon when using closeable prop', () => { expect(wrapper.emitted('update:show')[0][0]).toEqual(false); }); -test('should emit click-close-icon event when close icon is clicked', () => { +test('should emit clickCloseIcon event when close icon is clicked', () => { wrapper = mount(Popup, { propsData: { show: true, @@ -191,7 +191,7 @@ test('should emit click-close-icon event when close icon is clicked', () => { }); wrapper.find('.van-popup__close-icon').trigger('click'); - expect(wrapper.emitted('click-close-icon')).toHaveLength(1); + expect(wrapper.emitted('clickCloseIcon')).toHaveLength(1); }); test('should render correct close icon when using close-icon prop', () => { diff --git a/packages/vant/src/search/Search.tsx b/packages/vant/src/search/Search.tsx index b451e3bf7..56977d7a8 100644 --- a/packages/vant/src/search/Search.tsx +++ b/packages/vant/src/search/Search.tsx @@ -46,9 +46,9 @@ export default defineComponent({ 'clear', 'search', 'cancel', - 'click-input', - 'click-left-icon', - 'click-right-icon', + 'clickInput', + 'clickLeftIcon', + 'clickRightIcon', 'update:modelValue', ], @@ -104,11 +104,10 @@ export default defineComponent({ const onBlur = (event: Event) => emit('blur', event); const onFocus = (event: Event) => emit('focus', event); const onClear = (event: MouseEvent) => emit('clear', event); - const onClickInput = (event: MouseEvent) => emit('click-input', event); - const onClickLeftIcon = (event: MouseEvent) => - emit('click-left-icon', event); + const onClickInput = (event: MouseEvent) => emit('clickInput', event); + const onClickLeftIcon = (event: MouseEvent) => emit('clickLeftIcon', event); const onClickRightIcon = (event: MouseEvent) => - emit('click-right-icon', event); + emit('clickRightIcon', event); const fieldPropNames = Object.keys(fieldSharedProps) as Array< keyof typeof fieldSharedProps @@ -132,9 +131,9 @@ export default defineComponent({ onFocus={onFocus} onClear={onClear} onKeypress={onKeypress} - onClick-input={onClickInput} - onClick-left-icon={onClickLeftIcon} - onClick-right-icon={onClickRightIcon} + onClickInput={onClickInput} + onClickLeftIcon={onClickLeftIcon} + onClickRightIcon={onClickRightIcon} onUpdate:modelValue={onInput} {...fieldAttrs} /> diff --git a/packages/vant/src/search/test/index.spec.ts b/packages/vant/src/search/test/index.spec.ts index b9f43e89a..df2d81689 100644 --- a/packages/vant/src/search/test/index.spec.ts +++ b/packages/vant/src/search/test/index.spec.ts @@ -171,7 +171,7 @@ test('should render input name when using name prop', () => { expect(wrapper.find('input').element.getAttribute('name')).toEqual('foo'); }); -test('should emit click-left-icon event after clicking the left icon', async () => { +test('should emit clickLeftIcon event after clicking the left icon', async () => { const wrapper = mount(Search, { props: { leftIcon: 'foo', @@ -179,10 +179,10 @@ test('should emit click-left-icon event after clicking the left icon', async () }); await wrapper.find('.van-field__left-icon').trigger('click'); - expect(wrapper.emitted('click-left-icon')).toHaveLength(1); + expect(wrapper.emitted('clickLeftIcon')).toHaveLength(1); }); -test('should emit click-right-icon event after clicking the right icon', async () => { +test('should emit clickRightIcon event after clicking the right icon', async () => { const wrapper = mount(Search, { props: { rightIcon: 'foo', @@ -190,5 +190,5 @@ test('should emit click-right-icon event after clicking the right icon', async ( }); await wrapper.find('.van-field__right-icon').trigger('click'); - expect(wrapper.emitted('click-right-icon')).toHaveLength(1); + expect(wrapper.emitted('clickRightIcon')).toHaveLength(1); }); diff --git a/packages/vant/src/share-sheet/test/index.spec.ts b/packages/vant/src/share-sheet/test/index.spec.ts index 8d961c621..0e93b04cd 100644 --- a/packages/vant/src/share-sheet/test/index.spec.ts +++ b/packages/vant/src/share-sheet/test/index.spec.ts @@ -86,7 +86,7 @@ test('should render title and description slot correctly', () => { expect(wrapper.html()).toMatchSnapshot(); }); -test('should emit click-overlay event when overlay is clicked', async () => { +test('should emit clickOverlay event when overlay is clicked', async () => { const root = document.createElement('div'); const onClickOverlay = jest.fn(); const wrapper = mount(ShareSheet, { diff --git a/packages/vant/src/slider/Slider.tsx b/packages/vant/src/slider/Slider.tsx index 9ed73eeb1..2730e10cd 100644 --- a/packages/vant/src/slider/Slider.tsx +++ b/packages/vant/src/slider/Slider.tsx @@ -56,7 +56,7 @@ export default defineComponent({ props: sliderProps, - emits: ['change', 'drag-end', 'drag-start', 'update:modelValue'], + emits: ['change', 'dragEnd', 'dragStart', 'update:modelValue'], setup(props, { emit, slots }) { let buttonIndex: 0 | 1; @@ -221,7 +221,7 @@ export default defineComponent({ } if (dragStatus.value === 'start') { - emit('drag-start', event); + emit('dragStart', event); } preventDefault(event, true); @@ -253,7 +253,7 @@ export default defineComponent({ if (dragStatus.value === 'dragging') { updateValue(current, true); - emit('drag-end', event); + emit('dragEnd', event); } dragStatus.value = ''; diff --git a/packages/vant/src/slider/test/index.spec.ts b/packages/vant/src/slider/test/index.spec.ts index a51a36ed7..154f5a236 100644 --- a/packages/vant/src/slider/test/index.spec.ts +++ b/packages/vant/src/slider/test/index.spec.ts @@ -39,7 +39,7 @@ test('should emit "update:modelValue" event after clicking slider', () => { expect(wrapper.emitted('update:modelValue')!.pop()).toEqual([100]); }); -test('should emit drag-start event when start dragging', () => { +test('should emit dragStart event when start dragging', () => { const wrapper = mount(Slider, { props: { modelValue: 50, @@ -49,10 +49,10 @@ test('should emit drag-start event when start dragging', () => { const button = wrapper.find('.van-slider__button'); trigger(button, 'touchstart'); trigger(button, 'touchmove'); - expect(wrapper.emitted('drag-start')).toBeTruthy(); + expect(wrapper.emitted('dragStart')).toBeTruthy(); }); -test('should emit drag-end event when end dragging', () => { +test('should emit dragEnd event when end dragging', () => { const wrapper = mount(Slider, { props: { modelValue: 50, @@ -62,9 +62,9 @@ test('should emit drag-end event when end dragging', () => { const button = wrapper.find('.van-slider__button'); trigger(button, 'touchstart'); trigger(button, 'touchmove'); - expect(wrapper.emitted('drag-end')).toBeFalsy(); + expect(wrapper.emitted('dragEnd')).toBeFalsy(); trigger(button, 'touchend'); - expect(wrapper.emitted('drag-end')).toBeTruthy(); + expect(wrapper.emitted('dragEnd')).toBeTruthy(); }); test('should not allow to drag slider when disabled', async () => { diff --git a/packages/vant/src/steps/Steps.tsx b/packages/vant/src/steps/Steps.tsx index 26ff208be..23799313e 100644 --- a/packages/vant/src/steps/Steps.tsx +++ b/packages/vant/src/steps/Steps.tsx @@ -31,12 +31,12 @@ export default defineComponent({ props: stepsProps, - emits: ['click-step'], + emits: ['clickStep'], setup(props, { emit, slots }) { const { linkChildren } = useChildren(STEPS_KEY); - const onClickStep = (index: number) => emit('click-step', index); + const onClickStep = (index: number) => emit('clickStep', index); linkChildren({ props, diff --git a/packages/vant/src/steps/test/index.spec.tsx b/packages/vant/src/steps/test/index.spec.tsx index a634202aa..2ff9f5af5 100644 --- a/packages/vant/src/steps/test/index.spec.tsx +++ b/packages/vant/src/steps/test/index.spec.tsx @@ -18,12 +18,12 @@ test('should render icon slot correctly', () => { expect(wrapper.html()).toMatchSnapshot(); }); -test('should emit click-step event when step is clicked', () => { +test('should emit clickStep event when step is clicked', () => { const onClickStep = jest.fn(); const wrapper = mount({ setup() { return () => ( - + A B C diff --git a/packages/vant/src/tab/test/index.spec.tsx b/packages/vant/src/tab/test/index.spec.tsx index 93c689a25..3ea2b2fdb 100644 --- a/packages/vant/src/tab/test/index.spec.tsx +++ b/packages/vant/src/tab/test/index.spec.tsx @@ -3,13 +3,13 @@ import { mount, later, triggerDrag, mockScrollTop } from '../../../test'; import { Tab } from '..'; import { Tabs, TabsInstance } from '../../tabs'; -test('should emit click-tab event when tab is clicked', async () => { +test('should emit clickTab event when tab is clicked', async () => { const onClickTab = jest.fn(); const wrapper = mount({ render() { return ( - + 1 2 @@ -299,7 +299,7 @@ test('should allow to set name prop', async () => { Text @@ -336,7 +336,7 @@ test('should allow name prop to be zero', async () => { const wrapper = mount({ render() { return ( - + Text diff --git a/packages/vant/src/tabs/Tabs.tsx b/packages/vant/src/tabs/Tabs.tsx index 78949bac4..ea4990cd2 100644 --- a/packages/vant/src/tabs/Tabs.tsx +++ b/packages/vant/src/tabs/Tabs.tsx @@ -91,7 +91,7 @@ export default defineComponent({ props: tabsProps, - emits: ['change', 'scroll', 'rendered', 'click-tab', 'update:active'], + emits: ['change', 'scroll', 'rendered', 'clickTab', 'update:active'], setup(props, { emit, slots }) { let tabHeight: number; @@ -289,7 +289,7 @@ export default defineComponent({ route(item as ComponentPublicInstance); } - emit('click-tab', { + emit('clickTab', { name, title, event, diff --git a/packages/vant/src/tree-select/TreeSelect.tsx b/packages/vant/src/tree-select/TreeSelect.tsx index bfa35bd4b..56bc6f1b0 100644 --- a/packages/vant/src/tree-select/TreeSelect.tsx +++ b/packages/vant/src/tree-select/TreeSelect.tsx @@ -52,12 +52,7 @@ export default defineComponent({ props: treeSelectProps, - emits: [ - 'click-nav', - 'click-item', - 'update:activeId', - 'update:mainActiveIndex', - ], + emits: ['clickNav', 'clickItem', 'update:activeId', 'update:mainActiveIndex'], setup(props, { emit, slots }) { const isActiveItem = (id: number | string) => @@ -87,7 +82,7 @@ export default defineComponent({ } emit('update:activeId', activeId); - emit('click-item', item); + emit('clickItem', item); }; return ( @@ -114,7 +109,7 @@ export default defineComponent({ emit('update:mainActiveIndex', index); }; - const onClickSidebarItem = (index: number) => emit('click-nav', index); + const onClickSidebarItem = (index: number) => emit('clickNav', index); const renderSidebar = () => { const Items = props.items.map((item) => ( diff --git a/packages/vant/src/tree-select/test/index.spec.tsx b/packages/vant/src/tree-select/test/index.spec.tsx index 46a228ec8..da4caf192 100644 --- a/packages/vant/src/tree-select/test/index.spec.tsx +++ b/packages/vant/src/tree-select/test/index.spec.tsx @@ -42,7 +42,7 @@ test('should emit update:mainActiveIndex event when mainActiveIndex is changed', expect(wrapper.emitted('update:mainActiveIndex')?.[0]).toEqual([1]); }); -test('should emit click-nav event when nav item is clicked', async () => { +test('should emit clickNav event when nav item is clicked', async () => { const wrapper = mount(TreeSelect, { props: { items: mockItems, @@ -51,12 +51,12 @@ test('should emit click-nav event when nav item is clicked', async () => { const navItems = wrapper.findAll('.van-tree-select__nav-item'); await navItems[0].trigger('click'); - expect(wrapper.emitted('click-nav')?.[0]).toEqual([0]); + expect(wrapper.emitted('clickNav')?.[0]).toEqual([0]); await navItems[0].trigger('click'); - expect(wrapper.emitted('click-nav')?.[1]).toEqual([0]); + expect(wrapper.emitted('clickNav')?.[1]).toEqual([0]); }); -test('should emit click-item event when item is clicked', () => { +test('should emit clickItem event when item is clicked', () => { const wrapper = mount(TreeSelect, { props: { items: mockItems, @@ -66,10 +66,10 @@ test('should emit click-item event when item is clicked', () => { const items = wrapper.findAll('.van-tree-select__item'); items[0].trigger('click'); expect(wrapper.emitted('update:activeId')?.[0]).toEqual([mockItem.id]); - expect(wrapper.emitted('click-item')?.[0]).toEqual([mockItem]); + expect(wrapper.emitted('clickItem')?.[0]).toEqual([mockItem]); }); -test('should not emit click-nav event when disabled nav item is clicked', () => { +test('should not emit clickNav event when disabled nav item is clicked', () => { const wrapper = mount(TreeSelect, { props: { items: [ @@ -84,10 +84,10 @@ test('should not emit click-nav event when disabled nav item is clicked', () => const items = wrapper.findAll('.van-tree-select__nav-item'); items[0].trigger('click'); - expect(wrapper.emitted('click-nav')).toBeFalsy(); + expect(wrapper.emitted('clickNav')).toBeFalsy(); }); -test('should not emit click-item event when disabled item is clicked', () => { +test('should not emit clickItem event when disabled item is clicked', () => { const wrapper = mount(TreeSelect, { props: { items: [ @@ -106,7 +106,7 @@ test('should not emit click-item event when disabled item is clicked', () => { const items = wrapper.findAll('.van-tree-select__item'); items[0].trigger('click'); - expect(wrapper.emitted('click-item')).toBeFalsy(); + expect(wrapper.emitted('clickItem')).toBeFalsy(); }); test('should render content slot correctly', () => { diff --git a/packages/vant/src/uploader/Uploader.tsx b/packages/vant/src/uploader/Uploader.tsx index 4dbab14e4..9f5a528e6 100644 --- a/packages/vant/src/uploader/Uploader.tsx +++ b/packages/vant/src/uploader/Uploader.tsx @@ -90,9 +90,9 @@ export default defineComponent({ emits: [ 'delete', 'oversize', - 'click-upload', - 'close-preview', - 'click-preview', + 'clickUpload', + 'closePreview', + 'clickPreview', 'update:modelValue', ], @@ -221,7 +221,7 @@ export default defineComponent({ let imagePreview: ComponentInstance | undefined; - const onClosePreview = () => emit('close-preview'); + const onClosePreview = () => emit('closePreview'); const previewImage = (item: UploaderFileListItem) => { if (props.previewFullImage) { @@ -281,7 +281,7 @@ export default defineComponent({ v-slots={{ 'preview-cover': slots['preview-cover'] }} item={item} index={index} - onClick={() => emit('click-preview', item, getDetail(index))} + onClick={() => emit('clickPreview', item, getDetail(index))} onDelete={() => deleteFile(item, index)} onPreview={() => previewImage(item)} {...pick(props, ['name', 'lazyLoad'])} @@ -296,7 +296,7 @@ export default defineComponent({ } }; - const onClickUpload = (event: MouseEvent) => emit('click-upload', event); + const onClickUpload = (event: MouseEvent) => emit('clickUpload', event); const renderUpload = () => { if (props.modelValue.length >= props.maxCount || !props.showUpload) { diff --git a/packages/vant/src/uploader/test/index.spec.ts b/packages/vant/src/uploader/test/index.spec.ts index 73cac2700..ffcf59af6 100644 --- a/packages/vant/src/uploader/test/index.spec.ts +++ b/packages/vant/src/uploader/test/index.spec.ts @@ -504,14 +504,14 @@ test('closeImagePreview method', async () => { await nextTick(); await (wrapper.vm as Record).closeImagePreview(); - expect(wrapper.emitted('close-preview')).toBeFalsy(); + expect(wrapper.emitted('closePreview')).toBeFalsy(); wrapper.find('.van-image').trigger('click'); await (wrapper.vm as Record).closeImagePreview(); - expect(wrapper.emitted('close-preview')).toBeTruthy(); + expect(wrapper.emitted('closePreview')).toBeTruthy(); }); -test('click-preview event', () => { +test('clickPreview event', () => { const wrapper = mount(Uploader, { props: { previewFullImage: false, @@ -520,12 +520,12 @@ test('click-preview event', () => { }); wrapper.find('.van-image').trigger('click'); - expect(wrapper.emitted<[File]>('click-preview')![0][0]).toEqual({ + expect(wrapper.emitted<[File]>('clickPreview')![0][0]).toEqual({ url: IMAGE, }); expect( wrapper.emitted<[File, { name: string; index: number }]>( - 'click-preview' + 'clickPreview' )![0][1] ).toEqual({ name: '', @@ -533,7 +533,7 @@ test('click-preview event', () => { }); }); -test('close-preview event', async () => { +test('closePreview event', async () => { const wrapper = mount(Uploader, { props: { modelValue: [{ url: IMAGE }], @@ -550,7 +550,7 @@ test('close-preview event', async () => { triggerDrag(swipe, 0, 0); await later(300); - expect(wrapper.emitted('close-preview')).toBeTruthy(); + expect(wrapper.emitted('closePreview')).toBeTruthy(); }); test('show-upload prop', async () => { @@ -626,8 +626,8 @@ test('should not render upload input when using readonly prop', async () => { expect(wrapper.html()).toMatchSnapshot(); }); -test('should emit click-upload event when upload area is clicked', async () => { +test('should emit clickUpload event when upload area is clicked', async () => { const wrapper = mount(Uploader); wrapper.find('.van-uploader__upload').trigger('click'); - expect(wrapper.emitted('click-upload')).toBeTruthy(); + expect(wrapper.emitted('clickUpload')).toBeTruthy(); });