How can I do validation and to get text from inputs with useForm? – Reactjs

I want to do validation for my form before it will send to server, but I have a problem with useForm.

const {
    register, handleSubmit, setError, formState: { errors, isValid }
} = useForm<loginFor>()

const onSubmit: SubmitHandler<loginFor> = data => console.log(data);

My component where I try to do validation.
In my inputs I added {...register("password")} and {...register("mailOrNumber")}.
In my form I added onSubmit={handleSubmit(onSubmit)}.
But when I write something in input and then I click on button with type = submit I see at console browser this:

{mailOrNumber: undefined, password: undefined}

Why undefined?
API documentation for react-hook-form suggests that it must work.

return (
    <div className="popup-login">
        <div className="popup-login__cover-close-btn">
            <MyButton
                className="popup-login__close"
                type="button"
                onClick={changeStateForPopupClose}
            ></MyButton>
        </div>
        <div className="popup-login__main-cover">
            <form onSubmit={handleSubmit(onSubmit)}>
                <div className="popup-login__cover-block">
                    <h2 className="popup-payment__title">
                        {
                            enterOrRegister === 'вход' ? "Вход в учетную запись" :
                                "Регистрация"
                        }
                    </h2>
                    <div className="popup-login__enter">
                        <MyInput
                            type="text"
                            className={inputClass.join(' ')}
                            placeholder="email или номер телефона"
                            {...register("mailOrNumber")}
                        />
                        <div className="popup-login__for-btn-show-hide">
                            <MyInput
                                type={!stateShowPassword ? "password" : "text"}
                                className={mailEnter.password.length ? "popup- 
                                    login__input popup-login__input_password hidden" : "popup- 
                                    login__input popup-login__input_password" }
                            placeholder =  "password"
                            {...register("password")}
                                />
                            {
                                mailEnter.password.length != 0 &&
                                <div
                                    className="popup-login__for-btn-show-hide_btn"
                                    onClick={showPassword}
                                >
                                    {!stateShowPassword ? "SHOW" : "HIDE"}
                                </div>
                            }
                        </div>
                        {
                            enterOrRegister === 'вход' && <MyCheckbox />
                        }
                    </div>
                    {enterOrRegister === 'вход' &&
                        <div className="popup-login__additional">
                            <h2 className="popup-login__titile-register">Нет аккаунта?
                            </h2>
                            <MyButton
                                className="popup-login__register"
                                type="button"
                                onClick={changeFormRegister}
                            >
                                зарегистрироваться
                            </MyButton>
                        </div>
                    }
                </div>
                <div className="popup-login__cover-btns">
                    <MyButton
                        className="popup-login__btn"
                        type="submit"
                    // onClick = {clickedOnEnter}
                    >
                        {
                            enterOrRegister === 'вход' ? "Войти" : "Зарегистрироваться"
                        }
                    </MyButton>
                </div>
            </form>
        </div>
    </div>
);
};