Why is handleSubmit function from 'react-hook-form' ,causes the rendering of the component so many times

Question

When I use handleSubmit from 'react-hook-form' and the form component has so many child components .if I click form submit and use handleSubmit function ,The component is rendering so many times based on the child components .Why ? How to avoid this issue

When I try using

const FormComponent=()=>{

const {
        register,
        handleSubmit,
        errors,
        setValue,
        reset,
        control,
        getValues,
        watch,
        clearErrors,
        trigger,
    } = useForm({
       
    });

trigger().then((isValid) => {
                        if (isValid) {
                            const formData = getValues(); 
                            onSubmitform(formData);  
                            
                            
                           
                        }
                    });

return (<ChildComponent
errors={errors}
getValue={getValue}
setValue={setValue}
control={control}
register={register}
 watch={watch}
 clearErrors={clearErrors}
trigger={trigger}

>)
}

then form component renders only once

but when i try using

handleSubmit(onSubmitForm) 

.Then its rendering so many times