Компонент React не будет повторно отображаться при изменении состояния Redux - PullRequest
0 голосов
/ 10 апреля 2020

Я работаю над PWA, основанным на реакции с редуксом. Я получаю данные из сборки REST-API с symfony. Я заметил, что если я обновляю элемент из API, значения в хранилище меняются (Проверено с помощью dev-tools), но компонент не перерисовывается. Я просто показываю старые данные до тех пор, пока не обновлю sh (хранилище постоянно).

Кажется, что работает, если я изменяю переменную первого уровня, такую ​​как "isFetching", я правильно показываю экран загрузки и данные после получения завершена. Но это не сработает, если я изменю вложенную переменную, например "item.title". Кажется, у меня нет проблем с API, я просто заметил это. Поэтому я сделал следующий тест, который должен изменить описание, когда я изменяю заголовок (просто чтобы посмотреть, происходит ли что-то).

Последнее, что я попробовал, было создание редуктора следующим образом: https://redux.js.org/recipes/structuring-reducers/immutable-update-patterns#updating -nested-objects - но все равно не работает. Что я пропустил?

Вот пример для моего действия изменения, изменение на isDirty выполняет рендеринг, на элементе нет:

Действие

export function changeProject(item) {
    return {
        type: CHANGE_PROJECT,
        meta: {
            id: item.id,
        },
        data: {
            item,
        }
    }
}

Редуктор

export default function projectById(state = {}, action) {

    if (action.type === CHANGE_PROJECT) {
        return {
            ...state,
            [action.meta.id]: {
                ...state[action.meta.id],
                isDirty: true,
                item: {
                    ...state[action.meta.id].item,
                    ...action.data.item,
                    description1: action.data.item.title,
                },
            }
        };
    }

     return state;
}

mapStateToProps

function mapStateToProps(state, ownProps) {

    const { projectById } = state
    const { isDirty, item } = projectById[
        ownProps.match.params.id
    ] || {
        item: {},
    }

    return {
        item,
        isDirty,
    };
}
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...