Sự khác biệt giữa redux-thunk và redux-promise là gì?

Theo như tôi biết và sửa cho tôi nếu tôi sai, redux-thunk là một phần mềm trung gian giúp chúng tôi gửi hàm không đồng bộ và gỡ lỗi các giá trị trong chính hành động đó trong khi khi tôi sử dụng redux-hứa, tôi không thể tạo các hàm không đồng bộ mà không triển khai các chức năng của riêng mình cơ chế như Hành động ném một ngoại lệ chỉ gửi các đối tượng đơn giản.

Sự khác biệt chính giữa hai gói này là gì? Có bất kỳ lợi ích nào của việc sử dụng cả hai gói trong một ứng dụng phản ứng trang duy nhất hoặc gắn bó với redux-thunk sẽ là đủ?

redux-thunk cho phép người tạo hành động của bạn trả lại một hàm:

function myAction(payload){
    return function(dispatch){
        // use dispatch as you please
    }
}

redux-promise cho phép họ trả lại một lời hứa:

function myAction(payload){
    return new Promise(function(resolve, reject){
        resolve(someData); // redux-promise will dispatch someData
    });
}

Cả hai thư viện đều hữu ích nếu bạn cần gửi hành động không đồng bộ hoặc có điều kiện. redux-thunkcũng cho phép bạn gửi nhiều lần trong một người tạo hành động. Việc bạn chọn cái này, cái kia hay cả hai hoàn toàn phụ thuộc vào nhu cầu / phong cách của bạn.

Bạn có thể muốn / cần cả hai cùng nhau trong ứng dụng của mình. Bắt đầu với redux-promise cho các tác vụ không đồng bộ tạo hứa hẹn hàng ngày và sau đó mở rộng quy mô để thêm Thunks (hoặc Sagas, v.v.) khi độ phức tạp tăng lên :

• Khi cuộc sống đơn giản và bạn chỉ thực hiện công việc không đồng bộ cơ bản với những người sáng tạo trả lại một lời hứa duy nhất, sau đó redux-promisesẽ cải thiện cuộc sống của bạn và đơn giản hóa điều đó, nhanh chóng và dễ dàng. (Tóm lại, thay vì bạn cần suy nghĩ về việc 'mở gói' những lời hứa của mình khi chúng giải quyết, sau đó viết / gửi kết quả, redux-promise (-middleware) sẽ giải quyết tất cả những thứ nhàm chán đó cho bạn.)
• Nhưng, cuộc sống trở nên phức tạp hơn khi:
  • Có thể người tạo hành động của bạn muốn tạo ra một số lời hứa, mà bạn muốn gửi dưới dạng các hành động riêng biệt để tách các bộ giảm bớt?
  • Hoặc, bạn có một số logic điều kiện và tiền xử lý phức tạp cần quản lý, trước khi quyết định cách thức và nơi gửi kết quả?

Trong những trường hợp đó, lợi ích của redux-thunknó là nó cho phép bạn gói gọn sự phức tạp bên trong trình tạo hành động của mình .

Nhưng lưu ý rằng nếu Thunk của bạn tạo và gửi các lời hứa, thì bạn sẽ muốn sử dụng cả hai thư viện cùng nhau :

• Thunk sẽ soạn (các) hành động ban đầu và gửi chúng
• redux-promisesau đó sẽ xử lý việc mở gói tại (các) bộ rút gọn (các) lời hứa riêng lẻ được tạo bởi Thunk của bạn, để tránh các bản ghi sẵn dẫn đến. ( Thay vào đó, bạn có thể làm mọi thứ trong Thunks, với promise.then(unwrapAndDispatchResult).catch(unwrapAndDispatchError)... nhưng tại sao bạn lại làm thế?)

Một cách đơn giản khác để tổng hợp sự khác biệt trong các ca sử dụng: phần đầu so với phần cuối của chu trình hành động Redux :

• Thunks dành cho sự khởi đầu của luồng Redux của bạn: nếu bạn cần tạo một hành động phức tạp hoặc đóng gói một số logic tạo hành động phức tạp, giữ nó khỏi các thành phần của bạn và chắc chắn là không có trình giảm bớt.
• redux-promiselà cho phần cuối của quy trình của bạn, khi mọi thứ đã được chuyển thành những lời hứa đơn giản và bạn chỉ muốn mở chúng ra và lưu trữ giá trị đã giải quyết / bị từ chối của chúng trong cửa hàng

  ---

GHI CHÚ / REFS:

• Tôi thấy redux-promise-middlewarelà một sự triển khai đầy đủ và dễ hiểu hơn của ý tưởng đằng sau bản gốc redux-promise. Nó đang được phát triển tích cực và cũng được bổ sung một cách độc đáo redux-promise-reducer.
• có các phần mềm trung gian bổ sung tương tự có sẵn để soạn / sắp xếp các hành động phức tạp của bạn: một phần mềm rất phổ biến là redux-saga, rất giống redux-thunk, nhưng dựa trên cú pháp của các hàm trình tạo. Một lần nữa, bạn có thể sử dụng nó cùng với redux-promise.
• Đây là một bài viết tuyệt vời so sánh trực tiếp các tùy chọn thành phần không đồng bộ khác nhau, bao gồm cả thunk và redux-promise-middleware. (TL; DR: "Redux Promise Middleware giảm khá nhiều phần mềm soạn sẵn so với một số tùy chọn khác" ... "Tôi nghĩ tôi thích Saga cho các ứng dụng phức tạp hơn (đọc:" using ") và Redux Promise Middleware cho mọi thứ khác." )
• Lưu ý rằng có một trường hợp quan trọng mà bạn có thể nghĩ rằng bạn cần phải gửi nhiều hành động, nhưng thực sự thì không, và bạn có thể đơn giản hóa những việc đơn giản. Đó là nơi bạn chỉ muốn nhiều bộ giảm phản ứng với cuộc gọi không đồng bộ của bạn. Nhưng, không có lý do gì tại sao nhiều bộ giảm tốc không thể theo dõi một loại hành động. Bạn chỉ muốn đảm bảo rằng nhóm của bạn biết bạn đang sử dụng quy ước đó, vì vậy họ không cho rằng chỉ một bộ giảm thiểu duy nhất (có tên liên quan) có thể xử lý một hành động nhất định.

Tiết lộ đầy đủ: Tôi còn khá mới trong việc phát triển Redux và bản thân đã phải vật lộn với câu hỏi này. Tôi sẽ diễn giải câu trả lời ngắn gọn nhất mà tôi tìm thấy:

ReduxPromise trả về một lời hứa dưới dạng tải trọng khi một hành động được gửi đi và sau đó phần mềm trung gian ReduxPromise hoạt động để giải quyết lời hứa đó và chuyển kết quả đến trình giảm bớt.

Mặt khác, ReduxThunk buộc người tạo hành động tạm dừng việc thực sự gửi đối tượng hành động tới các bộ giảm thiểu cho đến khi cử hành động được gọi.

Đây là liên kết đến hướng dẫn mà tôi tìm thấy thông tin này: https://blog.tighten.co/react-101-part-4-firebase .