Состояние не обновляется

Question

При нажатии на input[type="change"] меняю данные о фотке через setAvatar:

function uploadHandler(event: any) {
        // code...

        reader.onload = () => {
            const result = reader.result;
            setAvatar((_: any) => ({ base64: result, filename: file.name }));
        };
    }

После этого avatar выглядит так:

Далее при нажатии на submit использую setUpdate, который находится в зависимостях для загрузки фото на сервер, также вывожу avatar:

function submitUpdate(event: React.FormEvent<HTMLFormElement>): void {
        event.preventDefault();

        if (id > 0) {
            setUpdate(true);
            console.log(avatar);
    }

Здесь происходит загрузка фото на сервер, где я получаю имя этой фотки в папке:

React.useEffect(() => {
        if (update && selectImage) {
            setLoad(true);

            const formData = new FormData();
            formData.append("avatar", selectImage);

            uploadAvatar(formData)
                .then((data: any) => {
                    const { success, message, dataFile } = data;

                    setText(message);

                    if (!success) {
                        setLoad(false);
                        setUpdate(false);
                        return;
                    }
  
          setAvatar({ ...avatar, filename: dataFile.filename });
                    dispatch(setUserToReducer({ ...user, avatar: dataFile.inBase64 }));
                    setUpdate(false);
                });

            setLoad(false);
        }
    }, [update]);

dataFile выглядит так:

Но при выводе avatar в submit avatar не меняется, то есть выглядит как на первой фотке, хотя обновление идет: setAvatar({ ...avatar, filename: dataFile.filename });

БЛОГ НА HUSL

Состояние не обновляется

Ответы (0 шт):