react thunk原理及原始碼分析

react-thunk原始碼：

function

createthunkmiddleware
(extraargument)
)=> next => action =>
// 如果傳過來的是普通物件，直接呼叫下乙個middleware
return
next
(action);}
;}//向外暴露
const thunk =
createthunkmiddleware()
;thunk.withextraargument = createthunkmiddleware;
export
default thunk;

default

function

(...middlewares)

//給middlewareapi物件掛載getstate和dispatch

const middlewareapi =

// 遍歷執行中介軟體函式，將middlewareapi作為引數傳入

//chain是儲存中介軟體新返回函式的陣列，裡面的元素是接收middlewareapi引數執行後的每個中介軟體函式

const chain = middlewares.

map(middleware =>

middleware

(middlewareapi)

)// 將所有中介軟體傳入到compose中,每個中介軟體都會用到dispatch

// 最後返回這個被所有中介軟體擴充套件過的dispatch

dispatch =

compose

(...chain)

(store.dispatch)

//返回乙個普通store物件，它可以被reducer直接處理

//返回的dispatch是被中介軟體擴充套件過的

return}}

compose.js原始碼:

export

default
function
compose
(...funcs)
//如果這個中介軟體引數只有乙個，那麼直接返回這個中介軟體函式
if(funcs.length ===1)
//遍歷所有中介軟體函式後，將其聚合返回乙個單一的dispatch函式
//多個中介軟體傳遞進來的時候，他會借用reduce方法組合(這個放在後面), 會有個...args引數，就是(store.dispatch)
return funcs.
reduce
((a, b)
=>
(...args)
=>a(
b(...args)))
}

redux系列之react thunk原始碼解讀

不過，redux只是乙個和其他庫無關的狀態管理庫，為了能夠方便的在react中使用，我們必須結合react redux來使用。react redux通過provider使用給react專案的所有子元件注入store，通過connect給元件注入state和dispatch。但是，有了react re...

關於crtmpserver編譯執行及原始碼修改

1 x86 linux版本編譯 x86平台有兩種編譯方式 使用 cmake 直接使用 make 一 使用cmake cd crtmpserver built cmake cmake make crtmpserver crtmpserver.lua 注意 crtmpserver.lua 中mediaf...

AbstractCollection原始碼分析

abstractcollection抽象類提供了collection的骨架實現,collection分析請看 這裡直接看它的 是如何實現的.public abstract iterator iterator 該方法沒有實現.public abstract int size 該方法沒有實現.publi...