how to re-render component with data from store (mobx)

34 views Asked by At

When I do put request for change info of user, component doesn't re-render. I use mob-x store. I thought that observer() need to re-render it, but when store.user updates it's doessn't work(

export const UserPersonalInfo: FC = observer(() => {
    const { store } = useContext(Context);

    const renderUserDataItem = (
        dataUser: React.ReactNode | string,
        label: string
    ) => (
        <li className={styles.user_data_item}>
            {label}
            {dataUser ? <span>{dataUser}</span> : <span>Не указано</span>}
        </li>
    );

    return (
        <div className={styles.container_user_data}>
            <ul className={styles.user_data_list}>
                {renderUserDataItem(
                    format(store.user.registrationDate, "dd-MM-yyyy") ||
                    "Не указано",
                    "Дата регистрации: "
                )}
                {renderUserDataItem(store.user.firstName, "Имя: ")}
                {renderUserDataItem(store.user.lastName, "Фамилия: ")}
            </ul>
            <ul className={styles.user_data_list}>
                {renderUserDataItem(store.user.country, "Страна: ")}
                {renderUserDataItem(store.user.sex, "Пол: ")}
                {renderUserDataItem(store.user.age, "Возраст: ")}
            </ul>
        </div>
    );
});

I expected re-render component after change of store.user

0

There are 0 answers