breaking change: event name become camelCase

This commit is contained in:
chenjiahan 2022-02-10 16:49:45 +08:00
parent c9c312c4ba
commit 8ca9741845
35 changed files with 139 additions and 149 deletions

View File

@ -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({
<Switch
v-model={data.isDefault}
size="24"
onChange={(event) => 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 && (
<Field

View File

@ -28,7 +28,7 @@ export default defineComponent({
showSearchResult: Boolean,
},
emits: ['blur', 'focus', 'input', 'select-search'],
emits: ['blur', 'focus', 'input', 'selectSearch'],
setup(props, { emit }) {
const field = ref<FieldInstance>();
@ -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());
};

View File

@ -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', () => {

View File

@ -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);

View File

@ -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', () => {

View File

@ -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)}
/>
<div ref={bodyRef} class={bem('body')} onScroll={onScroll}>
{months.value.map(renderMonth)}

View File

@ -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) {

View File

@ -62,7 +62,7 @@ export default defineComponent({
props: calendarMonthProps,
emits: ['click', 'update-height'],
emits: ['click'],
setup(props, { emit, slots }) {
const [visible, setVisible] = useToggle();

View File

@ -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 () => {

View File

@ -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: {

View File

@ -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({
<a
href={props.thumbLink}
class={bem('thumb')}
onClick={(event: MouseEvent) => emit('click-thumb', event)}
onClick={(event: MouseEvent) => emit('clickThumb', event)}
>
{renderThumbImage()}
{renderThumbTag()}

View File

@ -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', () => {

View File

@ -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<CascaderTab[]>([]);
@ -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)}
</Tabs>

View File

@ -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,
]);

View File

@ -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({
<Switch
v-model={contact.isDefault}
size={24}
onChange={(checked: boolean) => emit('change-default', checked)}
onChange={(checked: boolean) => emit('changeDefault', checked)}
/>
);

View File

@ -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);

View File

@ -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', () => {

View File

@ -42,14 +42,14 @@ export default defineComponent({
props: navBarProps,
emits: ['click-left', 'click-right'],
emits: ['clickLeft', 'clickRight'],
setup(props, { emit, slots }) {
const navBarRef = ref<HTMLElement>();
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) {

View File

@ -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', () => {

View File

@ -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: {

View File

@ -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();
};

View File

@ -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', () => {

View File

@ -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}
/>

View File

@ -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);
});

View File

@ -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, {

View File

@ -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 = '';

View File

@ -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 () => {

View File

@ -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,

View File

@ -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 () => (
<Steps active={1} onClick-step={onClickStep}>
<Steps active={1} onClickStep={onClickStep}>
<Step>A</Step>
<Step>B</Step>
<Step>C</Step>

View File

@ -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 (
<Tabs onClick-tab={onClickTab}>
<Tabs onClickTab={onClickTab}>
<Tab title="title1">1</Tab>
<Tab title="title2">2</Tab>
</Tabs>
@ -299,7 +299,7 @@ test('should allow to set name prop', async () => {
<Tabs
v-model:active={this.active}
onChange={onChange}
onClick-tab={onClickTab}
onClickTab={onClickTab}
>
<Tab title="title1" name="a">
Text
@ -336,7 +336,7 @@ test('should allow name prop to be zero', async () => {
const wrapper = mount({
render() {
return (
<Tabs onClick-tab={onClickTab}>
<Tabs onClickTab={onClickTab}>
<Tab title="title1" name={1}>
Text
</Tab>

View File

@ -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<RouteProps>);
}
emit('click-tab', {
emit('clickTab', {
name,
title,
event,

View File

@ -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) => (

View File

@ -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', () => {

View File

@ -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) {

View File

@ -504,14 +504,14 @@ test('closeImagePreview method', async () => {
await nextTick();
await (wrapper.vm as Record<string, any>).closeImagePreview();
expect(wrapper.emitted('close-preview')).toBeFalsy();
expect(wrapper.emitted('closePreview')).toBeFalsy();
wrapper.find('.van-image').trigger('click');
await (wrapper.vm as Record<string, any>).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();
});