diff --git a/packages/core/src/composables/useForm.ts b/packages/core/src/composables/useForm.ts index ef7f3f7..ff6cd24 100644 --- a/packages/core/src/composables/useForm.ts +++ b/packages/core/src/composables/useForm.ts @@ -390,14 +390,14 @@ export function useForm< } }; - const handleChange: FormEventHandler['handleChange'] = () => { - if (validateTiming.value === 'change') { + const handleChange: FormEventHandler['handleChange'] = (e) => { + if (validateTiming.value === 'change' || isRadioOrCheckbox(e.target)) { runAllValidateHandler(state.values); } }; - const handleInput: FormEventHandler['handleInput'] = () => { - if (validateTiming.value === 'input') { + const handleInput: FormEventHandler['handleInput'] = (e) => { + if (validateTiming.value === 'input' && !isRadioOrCheckbox(e.target)) { runAllValidateHandler(state.values); } }; @@ -697,3 +697,12 @@ function arrayMerge(target: T, source: T, options: any) { }); return destination; } + +function isRadioOrCheckbox( + target: EventTarget | null, +): target is HTMLInputElement { + if (!target || !(target instanceof HTMLInputElement)) { + return false; + } + return target.type === 'radio' || target.type === 'checkbox'; +} diff --git a/packages/core/src/types.ts b/packages/core/src/types.ts index 20b8e5b..acb2983 100644 --- a/packages/core/src/types.ts +++ b/packages/core/src/types.ts @@ -49,8 +49,8 @@ export interface FormState { export interface FormEventHandler { handleBlur: (event: Event | S, name?: S) => void; - handleChange: () => void; - handleInput: () => void; + handleChange: (event: Event) => void; + handleInput: (event: Event) => void; } export interface FieldRegisterOptions { @@ -152,8 +152,8 @@ export interface UseFormReturn { export type FieldAttrs = { name: string; onBlur: (event: Event) => void; - onChange: () => void; - onInput: () => void; + onChange: (event: Event) => void; + onInput: (event: Event) => void; }; export type FieldMeta = {