Redux基本介紹

2022-02-24 02:05:46 字數 1371 閱讀 7604

react 只是 dom 的乙個抽象層,並不是 web 應用的完整解決方案。有兩個方面,它沒涉及。【**結構】、【元件之間的通訊】。對於大型的複雜應用來說,這兩方面恰恰是最關鍵的。因此,【只用 react 沒法寫大型應用】。

為了解決這個問題,2023年 facebook 提出了 【flux 架構】的概念,引發了很多的實現。2023年,redux 出現,將 【flux 與函式式程式設計】結合一起,很短時間內就成為了最熱門的前端架構。

"【只有遇到 react 實在解決不了的問題,你才需要 redux】 。"簡單說,如果你的ui層非常簡單,沒有很多互動,redux 就是不必要的,用了【反而增加複雜性】。react 只是 dom 的乙個抽象層,並不是 web 應用的完整解決方案。有兩個方面,它沒涉及。

對於大型的複雜應用來說,這兩方面恰恰是最關鍵的。因此,只用 react 沒法寫大型應用。

為了解決這個問題,2023年 facebook 提出了 flux 架構的概念,引發了很多的實現。2023年,redux 出現,將 flux 與函式式程式設計結合一起,很短時間內就成為了最熱門的前端架構。

本文詳細介紹 redux 架構,由於內容較多,全文分成三個部分。今天是第一部分,介紹基本概念和用法。

首先明確一點,redux 是乙個有用的架構,但不是非用不可。事實上,大多數情況,你可以不用它,只用 react 就夠了。

曾經有人說過這樣一句話。

"如果你不知道是否需要 redux,那就是不需要它。"

redux 的創造者 dan abramov 又補充了一句。

"只有遇到 react 實在解決不了的問題,你才需要 redux 。"

簡單說,如果你的ui層非常簡單,沒有很多互動,redux 就是不必要的,用了反而增加複雜性。

上面這些情況,都不需要使用 redux。

上面這些情況才是 redux 的適用場景:多互動、多資料來源。

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

發生上面情況時,如果不使用 redux 或者其他狀態管理工具,不按照一定規律處理狀態的讀寫,**很快就會變成一團亂麻。你需要一種機制,可以在同乙個地方查詢狀態、改變狀態、傳播狀態的變化。

總之,不要把 redux 當作萬靈丹,如果你的應用沒那麼複雜,就沒必要用它。另一方面,redux 只是 web 架構的一種解決方案,也可以選擇其他方案。

參考:

redux詳細介紹

1 redux中的核心中store,store中的放有state,單一資料來源,狀態只能 於倉庫。2 state是唯讀的,你只能獲取狀態,你不能暴力地去修改倉庫中的狀態 3 store state reducer action 4 dispatch subscrbe getstate 建立倉庫 js...

redux基本使用

actiontype.js 隨著專案大型化,所以要抽取出來乙個actiontype.js檔案來記錄各種actiontype常量 export const set currentindex set currentindex store.js import from redux import rootr...

Redux 基本步驟小結

直接匯出函式,state defaultstate,action 先初始化 ultstate 函式體內根據action.type對資料執行不同的操作 用const newstate json.parse json.stringify state 對state進行深拷貝 const defaultst...