Redux-Thunk là một trong middleware phổ biến nhất được dùng làm xử lý những action bất đồng bộ trong Redux.

Bạn đang xem: Thunk là gì

Bạn đang xem: Redux thunk là gì

Bạn hoàn toàn có thể tìm hiểu cụ thể về middleware trong Redux sống đây.

Bạn có thể thấy biểu vật dụng so sánh các middleware của Redux được tải về nhiều nhất, khiến cho bạn biết được package làm sao là thịnh hành nhất.


*

*

Như chúng ta thấy sinh sống trên, redux-thunk là phổ cập nhất. So với những package khác là một khoảng cách xa :-)

Tôi đã sử dụng Redux-Saga, cùng thấy rằng nó đang phát triển từng ngày. Tôi cũng đã viết một bài về kiểu cách sử dụng nó ngơi nghỉ đây. Tôi đã vô cùng thích áp dụng saga, cơ mà tôi đã nói nó có một xíu phức hợp và tương đối không cần thiết đối với cùng 1 app dễ dàng cần bắt buộc xử lý các action sự không tương đồng bộ.

Tôi chưa dùng 2 package còn sót lại nên ko thể phản hồi về chúng.

Redux-thunk là một trong đoạn code nhỏ bạn cũng có thể xem qua:

function createThunkMiddleware(extraArgument) return ( dispatch, getState ) => next => kích hoạt => if (typeof kích hoạt === 'function') return action(dispatch, getState, extraArgument); return next(action); ;const thunk = createThunkMiddleware();thunk.withExtraArgument = createThunkMiddleware;export default thunk;Đúng vậy kia là toàn bộ về redux-thunk. Nhưng lại đừng bị lừa do sự đơn giản và dễ dàng này. Nó là 1 đoạn code đẹp và làm được rất nhiều thứ.

Cách tôi giúp đỡ bạn hiểu được redux-thunk là gì?

Thông qua việc tôi đã cần sử dụng redux-thunk vài ba lần, tôi mong muốn hiểu chính xác mọi thứ vận động như chũm nào.

Trong post này, tôi vẫn giải thích đúng chuẩn cách function applyMiddleware trong redux và createThunkMiddleware trong redux-thunk hoạt động. Họ cần hiểu đông đảo function này thật cụ thể cách async được xử lý.

Nếu bạn xem code 2 function applyMiddleware và createThunkMiddleware chúng hoàn toàn có thể khó nếu như bạn không quen thuộc với các concept dưới đây:

ES6 arrow functionsComposing functionsCurrying functions

Nếu chúng ta đã nắm rõ những concept bên trên thì bạn có thể đã biết phương pháp redux-thunk hoạt động, và nội dung bài viết này có thể không góp được gì các cho bạn.

Nhưng tôi vẫn viết bài bác này sẽ giúp đỡ những bạn chưa nắm vững những concept bên trên hoặc không biết tường tận về nó. Đâu kia ở mid level =))

Tôi đã viết một ví dụ bé dại về React-Redux, nó gồm xử lý một async action. Bạn có thể tham khảo ở đây.

Xem thêm: Các Dạng Bài Tập Tích Vô Hướng Của Hai Vectơ, Bài Tập Tích Vô Hướng Của Hai Vectơ

Trong ví dụ như này, tôi đã tạo ra một version của applyMiddleware cùng createThunkMiddleware để tôi bao gồm thể:

Convert ES6 arrow functions ko tên thành có tên để nắm rõ hơn.Thêm vào những console.log trong những function để dễ nắm bắt về flow.Và cũng chia nhỏ dại các step để dễ nắm bắt hơn.

Còn đó là version của applyMiddleware function của tôi: