Redux


redux
必ずしも反応器のみで使用されるとは限らないが、反応器でよく使われる状態管理ツールである.大規模なstateの管理に役立ち、コンポーネント間でデータを共有し、state管理が予測可能です.
状態管理は予測可能であり、すなわち、状態のみを純粋な関数、すなわちreduceが1)単一ソース2)読み取り専用状態3に変更することができる.従来のmvcモードでは、様々なコントローラ、モデル変更ビュー、ビュー変更モデルなどが存在する可能性がありますが、これらは予知できません.
redux flow
パイロットフローは、次の順序で構成されます.
action -> dispatcher
ユーザーの任意の動作とトリガ.
middleware
これはReduserが純粋な関数の形状を保つこととstateの状態を変更することに集中し,他のことを前処理する場所である.
root Reducer
ステータスのステータスを更新します.
store
ステータス・リポジトリ.
view(dom change)
変更データを反映する画面に変更します.
Reduxインストール
1) povider
すべてのコンポーネントにアクセスできるように、app.jsでは、すべてのものを囲むコンポーネントにしました.
2)root-reduceの作成
3)角度減速機emfrl
4)storeの作成
構成部品とワイヤの接続
propsを使用してreduceのstateに接続し、トリガとして使用します.
classの場合
mapStateToPropsの状態はrootReducerです.stateをpropsに接続します.
import { connect } from 'react-redux';

const mapStateToProps = state => ({
  currentUser: state.user.currentUser
});

export default connect(mapStateToProps)(Header);
mapDispatchToPropsはdispatchをpropsに接続します.
const mapDispatchToProps = dispatch => ({
  setCurrentUser: user => dispatch(setCurrentUser(user))
});

export default connect(null, mapDispatchToProps)(App);