Bài viết Redux Saga Là Gì – Giới Thiệu Về Redux Saga thuộc chủ đề về Hỏi Đáp đang được rất nhiều bạn quan tâm đúng không nào !! Hôm nay, Hãy cùng TruongGiaThien.Com.Vn tìm hiểu Redux Saga Là Gì – Giới Thiệu Về Redux Saga trong bài viết hôm nay nha !
Các bạn đang xem nội dung về : “Redux Saga Là Gì – Giới Thiệu Về Redux Saga”

Để hiểu redux-saga là gì thì đầu tiên ta cần biết về khái niệm middleware.Vậy middleware là gì?Ngay từ cái tên ta đã đoán được middleware là trung gian, mà ở đây chính là một lớp trung gian nằm giữa Dispatch Action và Reducers. Nó sẽ được gọi trước khi một action được dispatch.Để hiểu rõ hơn ta khả năng nhìn vào hình ảnh sau đây.

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

*

Tại đây middleware nằm giữa action và reducers, và nó thực hiện gọi đến API. Vậy ta khả năng tưởng tượng rằng middleware giống như một gián điệp trung gian trà trộn vào một tổ chức, nhiệm vụ của người gián điệp này là ngồi đợi tên trùm giao nhiệm vụ (action) cho đàn em của hắn(reducers), thực hiện một phi vụ buôn mai thúy sang đông Lào. Lúc này người gián điệp đánh điện báo cho cấp trên ( gọi API) để tiến hành vây bắt. Thế là kết quả của phi vụ này bị thay đổi ngay. Tên trùm bị ngồi tù, đàn em thì giải tán.

Side Effect:

Side Effect thì ta khả năng hiểu đơn giản là một action nào đó thực hiên một công việc tốn thời gian mà ta không định lượng được hoặc ta không care được, thí dụ: Đọc dữ liệu từ ổ cứng, gọi API lấy dữ liệu,….

Generator function:

Để hiểu được sự vận hành của redux saga bạn cần hiểu một vài khái niệm cơ bản như generator function. Generator function là function khả năng hoãn lại quy trình thực thi mà vẫn giữ nguyên được context.Khác với function bình thường là thực thi và trả về kết quả, thì Generator function khả năng thực thi, tạm dừng trả về kết quả và thực thi bằng tiếp. Từ khóa để làm được việc đấy là “YIELD”.Nói một cách đơn giản thì generator function là 1 function khả năng tạm ngưng trước khi hàm kết thúc (khác với pure function khi được gọi sẽ thực thi hết các câu lệnh trong hàm), và khả năng tiếp tục chạy tại một thời điểm khác. Chính chức năng mới này giúp ta giải quyết được việc bất đồng bộ, hàm sẽ dừng và đợi async chạy xong rồi tiếp tục thực thi.

Bài Nổi Bật  Gen Di Truyền Là Gì

Xem thêm: Tandem Là Gì – Tandem Có Nghĩa Là Gì

Redux-Saga:

Khái niệm: Từ những ý trên ta khả năng tóm gọn Redux-Saga là một thư viện redux middleware, giúp quản lý những side effect trong ứng dụng redux trở nên đơn giản hơn. Bằng việc dùng tối đa tính năng Generators (function*) của ES6, nó cho phép ta viết async code nhìn giống như là synchronos.

II. Redux-Saga vận hành như thế nào?

*

Đối với logic của saga, ta cung cấp một hàm cho saga, chính hàm này là hàm đứng ra xem xét các action trước khi vào store, nếu là action quan tâm thì nó sẽ thực thi hàm sẽ được thực thi.Một function trong saga là một generator function có dạng function* simpleSagaFunction() yield console.log(“hello world”); ở đây mình tạm gọi đây là một saga function.Qua ví dụ ở trên bạn có thấy một đặc điểm thú vị của redux-saga đem lại. Đúng vậy chính là nó yield, đây là một helper vô cùng hữu ích. Bởi vì khi ta cần một thao tác nào đó tốn thời gian thì việc đồng bộ luồng vận hành là vô cùng rất cần thiết, yield giúp ta ta xử lý vấn đề đó. Thực chất ở đây, yield sẽ cho dừng không chạy đoạn lệnh tiếp theo cho đến khi next()được gọi.một vài helper trong redux saga:takeEvery() : thực thi và trả lại kết quả của mọi actions được gọi.takeLastest() : có nghĩa là nếu chúng ta thực hiện một loạt các actions, nó sẽ chỉ thực thi và trả lại kết quả của của actions cuối cùng.take() : tạm dừng cho đến khi nhận được action.put() : dispatch một action.call(): gọi function. Nếu nó return về một promise, tạm dừng saga cho đến khi promise được giải quyết.race() : chạy nhiều effect cùng lúc ấy, sau đó hủy tất cả nếu một trong số đó kết thúc.

Bài Nổi Bật  Sao Y bản sao y Y Là Gì ? Thẩm Quyền, hồ sơ Chứng Thực Sao Y Bản Chính?

Xem thêm: ‎rise Of Kingdoms: Lost Crusade Trên App Store, ‎rise Of Kingdoms: Lost Crusade Trên App Store

III. Hướng dẫn cài đặt và dùng Redux-Saga

Hữu ích như vậy nhưng làm thế nào để ta có thế áp dụng saga vào project của chúng ta?

Đầu tiên ta cần install redux-saga vào trong project:$ npm install –save redux-sagaor$ yarn add redux-saga

Cấu hình lại store để thêm middleware vào giữa luồng đi của action và reducer

import createStore, applyMiddleware from “redux” import createSagaMiddleware from “redux-saga” import reducer from “./reducers” import mySaga from “./sagas” // create the saga middleware const sagaMiddleware = createSagaMiddleware() // mount it on the Store const store = createStore( reducer, applyMiddleware(sagaMiddleware) ) // then run the saga sagaMiddleware.run(mySaga) // render the applicationTạo file mySaga đã được import ở trên:

import call, put, takeEvery, takeLatest from “redux-saga/effects” import Api from “…” // worker Saga: will be fired on USER_FETCH_REQUESTED actions function* fetchUser(action) try const user = yield call(Api.fetchUser, action.payload.userId); yield put(type: “USER_FETCH_SUCCEEDED”, user: user); catch (e) yield put(type: “USER_FETCH_FAILED”, message: e.message); /* Starts fetchUser on each dispatched `USER_FETCH_REQUESTED` action. Allows concurrent fetches of user. */ function* mySaga() yield takeEvery(“USER_FETCH_REQUESTED”, fetchUser); /* Alternatively you may use takeLatest. Does not allow concurrent fetches of user. If “USER_FETCH_REQUESTED” gets dispatched while a fetch is already pending, that pending fetch is cancelled and only the latest one will be run. */ function* mySaga() yield takeLatest(“USER_FETCH_REQUESTED”, fetchUser); export default mySaga;IV. Kết luận

Ở bài viết này mình tập trung giải thích một vài khái niệm để các bạn hình dung được saga nó là cái gì. Nó vận hành ra làm sao.

Bài Nổi Bật  Bảo Lãnh Dự Thầu Là Gì

Chuyên mục: Hỏi Đáp

Các câu hỏi về Redux Saga Là Gì – Giới Thiệu Về Redux Saga


Nếu có bắt kỳ câu hỏi thắc mắt nào vê Redux Saga Là Gì – Giới Thiệu Về Redux Saga hãy cho chúng mình biết nha, mõi thắt mắt hay góp ý của các bạn sẽ giúp mình nâng cao hơn hơn trong các bài sau nha <3 Bài viết Redux Saga Là Gì - Giới Thiệu Về Redux Saga ! được mình và team xem xét cũng như tổng hợp từ nhiều nguồn. Nếu thấy bài viết Redux Saga Là Gì - Giới Thiệu Về Redux Saga Cực hay ! Hay thì hãy ủng hộ team Like hoặc share. Nếu thấy bài viết Redux Saga Là Gì - Giới Thiệu Về Redux Saga rât hay ! chưa hay, hoặc cần bổ sung. Bạn góp ý giúp mình nha!!

Các Hình Ảnh Về Redux Saga Là Gì – Giới Thiệu Về Redux Saga

Redux Saga Là Gì - Giới Thiệu Về Redux Saga

Các từ khóa tìm kiếm cho bài viết #Redux #Saga #Là #Gì #Giới #Thiệu #Về #Redux #Saga

Tra cứu thêm kiến thức về Redux Saga Là Gì – Giới Thiệu Về Redux Saga tại WikiPedia

Bạn khả năng tham khảo nội dung chi tiết về Redux Saga Là Gì – Giới Thiệu Về Redux Saga từ trang Wikipedia.◄

Tham Gia Cộng Đồng Tại

💝 Nguồn Tin tại: https://truonggiathien.com.vn/

💝 Xem Thêm Chủ Đề Liên Quan tại : https://truonggiathien.com.vn/hoi-dap/

Give a Comment