15.06 (Разница между connect и connectAdvanced react-redux)

15.06 (Разница между connect и connectAdvanced react-redux)

N/V
"Пишу о том, что встречается на моем пути в мире front-end разработки."


connect([mapStateToProps], [mapDispatchToProps], [mergeProps], [options])

привязывает react компонент к redux store. connect это фасад вокруг connectAdvanced, обеспечивая удобных api для наиболее распространенных случаев использования.

[mapStateToProps(state, [ownProps]): stateProps] (Function): если этот аргумент объявлен, новый компонент подписывается на изменения redux store. Это значит, что каждый раз, когда store обновляется, mapStateToProps будет вызван. Результатом должен быть обычный объект, который будет соединен с другими props компонента. Если вы не хотите подписываться на изменения store, передайте null или undefined вместо mapStateToProps;

если ваша функция mapStateToProps получает два параметра, то она будет вызвана с состоянием store в первом параметре и props , которые были переданы привязанному компоненту во втором параметре, и будет так же повторно вызвана, когда привязанный компонент получает новые props.

[mapDispatchToProps(dispatch, [ownProps]): dispatchProps]  (Object or Function) если авозвращает объект, то каждая функция внутри него считается redux action creator. Объект с такими же названиями функций, но с каждым action creator обернутым в dispatch будут объеденены с props компонента.

Если передана функция, то она будет получаться dispatch в качестве первого аргумента. Это позволяет вам вернуть объект, который так или иначе использует dispatch для того, чтобы привязать action creators вашим собственным способом.

Если ваша функция mapDispatchToprops принимает два аргумента, то первым будет dispatch,а вторым будут все props переданные в компонент, ибудет вызвана каждый раз когда соединенный компонент принимает новые аргументы.

[mergeProps(stateProps, dispatchProps, ownProps): props] (Function): если объявлены, то результатом является

...https://github.com/reduxjs/react-redux/blob/master/docs/api.md

"в следующий раз так сильно не расписывать"



Report Page