Как предотвратить повторный рендер компонента при изменении redux store?

Question

[alex4answ]

Добрый день, столкнулся с непонятной мне вещью.

Есть компонент - контейнер, который использует 1 часть стора и изменяет другую часть:

const date = useSelector(state => state.dashboard.date);

useEffect(() => {
  dispatch(getAllHouses());
}, [dispatch, date]);

В итоге, когда изменяется одна часть стора, которая не используется в этом компоненте (загружаются все houses), компонент рендерится повторно и снова срабатывает useEffect ( хотя date тот же самый, я даже возвращаю часть state, а не новый объект из state )

В итоге все скатывается в бесконечный цикл рендера, почему и как этого избежать?
Я правильно понимаю что изменяя одну часть store, которая даже не используется в данный момент (на странице и компонентах), будет выполнен повторный рендер дерева начиная с Redux Provider ?

Comments

[Tim]

почему у тебя в зависимостях useEffect передана функция?

[alex4answ]

Tim, eslint требует

[Mikhail Osher]

Tim, `dispatch` не меняется, и не является причиной ре-рендера

[Mikhail Osher]

А какая структура/тип данных возвращается в date?

[alex4answ]

Mikhail Osher, объект:

interface DashboardState {
  from: Date;
  to: Date;
}

[Mikhail Osher]

alex4answ, мало кода, чтобы сделать выводы. Есть подозрение, что возвращается новый объект. Таким образом переменная date всегда будет "новая", и будет запускаться useEffect.

[alex4answ]

Mikhail Osher, сейчас попробую как-то отловить этот момент, а При изменении store на повторный рендер отправляется все дерево, или только те части что используют измененную часть state?

[Mikhail Osher]

alex4answ, сравнивается то, что вы функцией-селектором возвращаете. Проверьте, чтобы всё, что происходит внутри getHouses не перезаписывало state.dashboard и не трогало state.dashboard.date

[Tim]

Mikhail Osher, dispatch меняет стейт. Видимо меняется date и получается бесконечный цикл. Это только предположение. нужен полный код

[alex4answ]

Mikhail Osher, не понимаю почему селектор возвращает новый объект, все диспатчи и редюсеры не изменяют dashboard, добавил shallowEqual, все ок, но причина не понятна