Redux基本原理和使用

2021-08-03 08:54:43 字數 1309 閱讀 7017

redux不是說任何的應用都要用到它,如果遇到了react解決不了得問題,可以考慮使用它。

例如:使用者的使用方式複雜

不同身份的使用者有不同的使用方式(比如普通使用者和管理員)

多個使用者之間可以協作

與伺服器大量互動,或者使用了websocket

view要從多個**獲取資料

redux的設計思想:

(1)web 應用是乙個狀態機,檢視與狀態是一一對應的。

(2)所有的狀態,儲存在乙個物件裡面。

redux的基本概念和api:

1. store 儲存資料的地方。整個應用只能有乙個store。 函式createstore來生成store。

2. state store包含資料的集合。store.getstate() 來得到當前時刻的state. redux規定乙個state對應乙個view。state相同則view相同。

3.action view與state不能直接互動,view發出通知給action 表示state將要變化。 其中type屬性是必然的。

store.dispatch()是view發出action的唯一方法。

4.reducer:state收到action之後會生成乙個新的state,這個計算過程叫做reducer..reducer是乙個函式,他接受action和當前的state來作為引數,返回乙個新的state

redux工作流程:

1. 首先使用者發出action。 store.dispatch(action);

3.state 一旦有變化,store 就會呼叫監聽函式。

// 設定監聽函式

store.subscribe(listener);

listener可以通過store.getstate()得到當前狀態。如果使用的是 react,這時可以觸發重新渲染 view。

function listerner()

計數器的例項:

const counter = () =>(+-

);const reducer = (state=0, action) =>

}//傳入reducer則store.dispatch會自動觸發reducer的自動執行

const sotre = createstore(reducer);

const render = () => )}

ondecrement=)}

/>,

document.getelementbyid('root'));}

render();

//state狀態發生變化時 會自動呼叫render

store.subscribe(render);

Redux基本原理

1 redux store 儲存資料 2 view 檢視元件可以利用store.getstate 方法讀取值,也可以使用store.dispatch 方法改變redux store裡面的值的狀態,當資料發生變化時候,檢視層通過componentdidmount 鉤子中實現store.subscrib...

mysql的基本原理 Mysql 基本原理

mysql 基本原理 mysql是一種關聯式資料庫管理系統,關聯式資料庫將資料儲存在不同的表中,而不是將所有資料放在乙個大倉庫內,這樣就增加了速度並提高了靈活性 ysql是資料庫登入命令 uroot預設超級使用者登入 p 預設沒密碼 中寫密碼 mysqladmin uroot password 12...

8 2 1 基本原理

乙個舞台動畫物件在包含許多舞台資訊 出現在何處,佔多大面積,處在什麼角度,是否可見 這些資訊分別儲存在動畫物件的屬性中。在 中讀取這些屬性可以了解物件的位置 大小 角度等狀態資訊 修改這些屬性可以改變物件的位置 大小 角度等狀態。如果從資料的角度去理解,動畫就是在固定時間間隔點不斷修改動畫物件某項屬...