Компонент повторно визуализируется, когда состояние является объектом объектов - PullRequest
Новая
       7

Компонент повторно визуализируется, когда состояние является объектом объектов

0 голосов
/ 29 января 2019

У меня есть несколько редукционных форм на одной странице.Мне удалось создать различные формы с использованием атрибута form при рендеринге компонента. 

<ItemDetail form={itemName} />

Но я использую хранилище избыточностей для поддержания состояния для моего компонента.Я создаю хранилище с избыточностью динамически, как-то так: 

const currentState = { ...state };
currentState[action.itemName].itemHash = 'fetching';
currentState[action.itemName].itemType = '';
return currentState;

Проблема в том, что когда я обновляю какое-либо свойство этого объекта, компонент не рендерится повторно.

Если я это сделаю:

const currentState = { ...state };
currentState[action.itemName]={};
currentState[action.itemName].itemHash = 'fetched';

корректно перерисовывает компонент.Но если я просто сделаю: 

const currentState = { ...state };
currentState[action.itemName].itemHash = 'fetching';

, это не сделает его заново.

Хотя есть обходной путь для глубокого клонирования объекта предмета или так же, как показано выше.Но не уверен, что это хороший способ сделать это или мы можем сделать это более чистым способом.

Любая помощь приветствуется!

1 Ответ

0 голосов
/ 29 января 2019

Ваш компонент не выполняет повторную визуализацию, поскольку React сделает поверхностное сравнение состояния.Это делается путем итерации ключей сравниваемого состояния и возврата значения true, когда значения ключа в каждом объекте не являются строго равными.

В вашем случае вам необходимо создать новый объект для вашего currentState[action.itemName] свойства: 

    const currentState = { ...state };

    currentState[action.itemName] = {
      ...currentState[action.itemName],
      itemHash = 'fetching',
      itemType = '';
    };

    return currentState;
...