TIL) 210607 Redux

3527 ワード
テキストリンク

Reduxとは?


共通の親によってステータス値を管理するフィードバック設計モードでは、構成部品以外でステータスを管理することで、プロジェクトのステータスをより簡単に理解でき、プロジェクト規模が増大した場合のステータス管理の難題を解決できます.これは、デバッグとテストが容易なライブラリです.

Fluxモード



設計モードにはDispatcher、Stores、Viewsが含まれます.
Reactのように、一方向データストリームに従います.

Reduxの構造


Action

{
  type: "Todo", //필수항목
  data: {
    id: 0,
    text: "something"
  }
}
Actionは、タイプが明確なオブジェクトデータをReducerに渡します.このデータは、ステータスをどのように更新するかを指定します.

Reducer


Reducerは、現在の状態と動作で伝達されたタイプの加工データに基づいて状態を更新する.
function reducer(state, action) {
  if(action.type){
  	...
  }
  ...
  
  return changedState
}
*Reducerは純真を付与する必要があります.

Dispatch


dispatchはショップの内蔵関数で、reduceに動作を送信します.
	dispatch(action)

Store


ReducerやDispatchなどの組み込み関数を含むアプリケーションのすべてのステータスを保存します.
//store.js
export const store = createStore(rootReducer, applyMiddleware(...middlewares));

//index.js
 <Provider store={store}>
    <App />
 </Provider>

Subscribe


ショップの内蔵関数の1つとして、関数形式の値をパラメータとして使用します.
アクションが派遣されるたびに、渡された関数が呼び出されます.
[iOS] View Controller LifeCycle
UTF-8エンコードファイルフロントエンドのDOMをクリア