redux基本使用

2021-09-29 02:31:15 字數 1276 閱讀 1764

actiontype.js

隨著專案大型化,所以要抽取出來乙個actiontype.js檔案來記錄各種actiontype常量

export  const set_currentindex ='set_currentindex';
store.js

import  from 'redux';

import rootreducer from '../reducers';

const store = createstore(rootreducer,window.__redux_devtools_extension__ && window.__redux_devtools_extension__());

export default store;

action.js

action 是把資料從應用(譯者注:這裡之所以不叫 view 是因為這些資料有可能是伺服器響應,使用者輸入或其它非 view 的資料 )傳到 store 的有效載荷。它是 store 資料的唯一**。一般來說你會通過 store.dispatch() 將 action 傳到 store。

import  * as types from '../actiontypes';

import store from '../store';

export const indexactioncreators =

}}

reducers.js

reducers 指定了應用狀態的變化如何響應 actions 併發送到 store 的,actions 只是描述了有事情發生了這一事實,並沒有描述應用如何更新 state。

import   from 'redux';

import * as types from '../actiontypes';

const rootreaducer = combinereducers()

function currentindex(prestate = 0 , action )

}

元件.js

dispatch的作用是分發 action,這是觸發 state 變化的惟一途徑。

store.dispatch(indexactioncreators.setcurrentindex(index));

Redux基本使用(一)

redux基礎 一 設計思想 react是單項資料流框架,為了在相對較大的專案中方便進行狀態管理。二 基本概念 1.store 儲存資料並且是改變state的地方,用createstore來進行建立。整個應用只能有乙個 import from redux createstore函式用來接收reduc...

redux的基本使用方法

redux的使用 檔案store index.js import from redux const counterreducer function statr 0,action const store creatstore counterreducer export default store 元件...

Redux基本介紹

react 只是 dom 的乙個抽象層,並不是 web 應用的完整解決方案。有兩個方面,它沒涉及。結構 元件之間的通訊 對於大型的複雜應用來說,這兩方面恰恰是最關鍵的。因此,只用 react 沒法寫大型應用 為了解決這個問題,2014年 facebook 提出了 flux 架構 的概念,引發了很多的...