redux入門基礎

2021-08-22 09:55:24 字數 1371 閱讀 8746

1.redux 適用場景:

多互動,多資料來源。

2.從元件角度看,如果你的應用有以下場景,可以考慮redux:

某個組建的狀態需要共享;

某個狀態需要在任何地方都可以拿到;

乙個元件需要改變全域性狀態

乙個元件需要改變另乙個元件的狀態

3.設計思想:

web應用是乙個狀態機,檢視與狀態一一對應

所有物件都儲存在乙個物件裡

基本概念和api

4.store

儲存資料的乙個地方,可以看成乙個容器,整個應用只有乙個store,redux提供createstore這個函式,用來生成store

5.store.getstate()

store物件包含所有資料,想要得到某個時點的資料,就要對store生成快照,這種時點的資料集合,就叫做state;

當前時刻的state通過store.getstate()拿到;

乙個state對應乙個view

6.action

state的變化是由view導致的,action就是view發出的通知,表示vstate就要發生變化了。

action是乙個物件,其中type屬性是必須的,博鰲是action的名稱。

7.action creator

view要傳送多少種資訊,就要傳送多少種action,很麻煩,可以定義乙個函式來生成action,這個函式就叫做action creator

8.store.dispatch()

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

9.reducer

store收到action以後,必須給出乙個新的state,這樣view才會發生變化,這種state的計算過程叫做reducer

reduc而是乙個函式,接受action和當前的state作為引數,返回乙個新的state

10.store.subscribe

store允許store.subscribe()設定監聽函式,一旦state發生變化就自動執行這個函式

redux中介軟體的理解

1.reducer:純函式,只承擔計算state的功能,不是和承擔其他功能,

2.view:於state意義對應,可以看做是state的視覺層

3.action:存放資料的物件,即訊息的載體,只能被別人驚醒操作

早就在傳送action的時候即store.dispatch()方法,可以新增成功

Redux基礎使用與入門

react redux是redux的官方react繫結資料的庫。它能夠使你的react元件從store中讀取資料,運算元據並且向store分發actions以更新資料。初體驗工作流 state狀態 到檢視展示 通過action操作reducer render操作倉庫資料 流程 const reduc...

Redux的基礎使用入門(一)

redux 商店 store,存放state的容器 狀態 state,就是應用中需要使用的資料 動作 action,定義資料操作 通知 dispatch,傳送操作請求 函式 reducer,處理資料的業務邏輯 得到乙個資料容器 store let store redux.createstore fn...

Redux 入門學習

2014年 facebook 提出了 flux 架構的概念,引發了很多的實現。2015年,redux 出現,將 flux 與函式式程式設計結合一起,很短時間內就成為了最熱門的前端架構。redux 是乙個改變狀態 state 的模型,這個模型通過乙個單向操作的方式來改變狀態。redux 和 react...