Почему обновляется родительский элемент react+redux?

Question

[toly19]

Есть 2 компонента:
App и AppSmall
AppSmall вложен в App

и App и AppSmall через connect подключены к стору.

Теперь, если я вызываю dispatch у вложенного AppSmall, то он перерендеривается вместе с родителем.
Почему.
Может так и должно быть???
Мне нужно, чтобы как при setState, перерендеривались только компонент+ (если нужно) потомки.

Кода много, поэтому вот: codepen.io
P.S. открывайте консоль

Answer 1

[Максим]

...
let AppSmallRedux = connect(
    (store) => ({ data: store.reducerAppSmall }), // (1)
    dispatch => ({
        update: () => dispatch({ type: "UPDATE_AppSmall" })
    })
)(AppSmall);
...
let AppRedux = connect(
    (store) => ({ data: store.reducerApp }), // (2)
    dispatch => ({
        update: () => dispatch({ type: "UPDATE_App" })
    })
)(App);
...

В пунктах (1) и (2) вы подписывались на весь STORE, следовательно, если он менялся, то у вас на это реагировали все "приконекченные" компоненты. Если подписываться только на "нужный кусочек стора" - то все будет ок.

Ваш обновленный пример (codepen).