Контейнерные компоненты плохие? Следует использовать вместо этого store.getState и store.dispatch?

Question

В ответьте, как он выясняет, нужно ли повторно отображать-dom, путем тестирования ссылок на объекты/функции.

Так что при каждом обновлении рассчитывается все JS. Значения элементов контейнеров вернуть две совершенно новые объекты друг время, один для maptDispatchToProps и один для mapStateToProps:

const mapStateToProps = (state, ownProps) => { 
    return { 
    active: ownProps.filter === state.visibilityFilter 
    } 
} 

const mapDispatchToProps = (dispatch, ownProps) => { 
    return { 
    onClick:() => { 
     dispatch(setVisibilityFilter(ownProps.filter)) 
    } 
    } 
} 

В коде выше мы видим новый объект каждый временной содержащий active ключ и затем новый объект содержащий новую функцию до onClick. Ссылки на эти 3 являются совершенно новыми на каждом js-цикле. React будет сравнивать эти ссылки, а затем он будет пересчитывать js в компоненте. Но я подумал, что с сокращением не нужно было тестировать shouldComponentUpdate, как это может быть, когда все эти 3 ссылки изменились? Укажите onClick, что вызовет реакцию на removeEventListener, затем добавьте onClick назад с addEventListener.

Answer 1

Вы не понимаете, как работает «неглубокое равенство». Обе функции React's PureRenderMixin и React Redux connect используют «неглубокое равенство», чтобы определить, действительно ли что-то изменилось. Это означает, что значения верхнего уровня двух объектов сравниваются, чтобы увидеть, равна ли каждая пара значений ===, а не сравнивать, если сами объекты одинаковы. Таким образом, если у меня есть:

var a = {q : 42}; 
var b = {a : a}; 
var c = {a : a}; 

Тогда В и С являются совершенно разных объектов, но неглубоко равных, потому что для них обоих, поле «а» указывает на тот же объект.

Кроме того, в случае функции React Redux connect() она в первую очередь проверяет возвращаемое значение mapStateToProps, чтобы увидеть, нужно ли обновлять упакованный компонент.