В чем разница между redux-thunk и redux-prom?

Насколько я знаю и исправляю меня, если я ошибаюсь, redux-thunk - это промежуточное ПО, которое помогает нам отправлять асинхронные функции и отлаживать значения в самом действии, в то время как, когда я использовал redux-обещание, я не мог создавать асинхронные функции без реализации моих собственных механизм, поскольку действие генерирует исключение отправки только простых объектов.

В чем основные различия между этими двумя пакетами? Есть ли какие-то преимущества от использования обоих пакетов в одном приложении для реагирования на страницу или достаточно использовать redux-thunk?

redux-thunk позволяет создателям ваших действий возвращать функцию:

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

redux-promise позволяет им вернуть обещание:

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

Обе библиотеки полезны, если вам нужно отправить действие асинхронно или условно. redux-thunkтакже позволяет отправлять несколько раз в одном создателе действия. Независимо от того, выберете ли вы один, другой или оба, полностью зависит от ваших потребностей / стиля.

Скорее всего, вы захотите / вам понадобятся оба вместе в вашем приложении. Начните с redux-prom для рутинных асинхронных задач по созданию обещаний, а затем увеличивайте масштаб, добавляя Thunks (или Sagas и т. Д.) По мере увеличения сложности :

• Когда жизнь проста, и вы просто выполняете базовую асинхронную работу с создателями, которые возвращают одно обещание, redux-promiseэто улучшит вашу жизнь и упростит ее, быстро и легко. (Вкратце, вместо того, чтобы думать об «разворачивании» своих обещаний, когда они разрешаются, а затем записывать / отправлять результаты, redux-prom (-middleware) позаботится обо всех этих скучных вещах за вас.)
• Но жизнь усложняется, когда:
  • Может быть, ваш создатель действий хочет создать несколько обещаний, которые вы хотите отправить как отдельные действия в отдельные редукторы?
  • Или вам нужно управлять сложной предварительной обработкой и условной логикой, прежде чем решить, как и куда отправлять результаты?

В этих случаях преимущество redux-thunkсостоит в том, что он позволяет вам инкапсулировать сложность внутри вашего создателя действия .

Но обратите внимание, что если ваш Thunk создает и отправляет обещания, вы захотите использовать обе библиотеки вместе :

• Преобразователь будет составлять исходное действие (я) и отправлять их
• redux-promiseзатем обработает разворачивание в редукторе (ах) отдельных обещаний, сгенерированных вашим Thunk, чтобы избежать шаблонного, который влечет за собой. ( Вместо этого вы могли бы делать все в Thunks, с promise.then(unwrapAndDispatchResult).catch(unwrapAndDispatchError)... но зачем вам это?)

Еще один простой способ суммировать разницу в вариантах использования: начало и конец цикла действий Redux :

• Преобразователи предназначены для начала вашего потока Redux: если вам нужно создать сложное действие или инкапсулировать некоторую корявую логику создания действий, не допуская ее к вашим компонентам и определенно из редукторов.
• redux-promiseпредназначен для конца вашего потока, когда все было сведено к простым обещаниям, и вы просто хотите их развернуть и сохранить их разрешенное / отклоненное значение в магазине

  ---

ПРИМЕЧАНИЯ / ССЫЛКИ:

• Я считаю, redux-promise-middlewareчто это более полная и понятная реализация идеи, лежащей в основе оригинала redux-promise. Он находится в стадии активной разработки, а также хорошо дополнен redux-promise-reducer.
• есть дополнительные похожие промежуточные программы, доступные для составления / упорядочивания ваших сложных действий: очень популярно одно redux-saga, которое очень похоже на redux-thunk, но основано на синтаксисе функций генератора. Опять же, вы, вероятно, использовали бы его вместе с redux-promise.
• Вот отличная статья, в которой напрямую сравниваются различные варианты асинхронной композиции, включая thunk и redux-prom-middleware. (TL; DR: «Промежуточное ПО Redux Promise значительно сокращает количество шаблонов по сравнению с некоторыми другими вариантами» ... «Я думаю, что мне нравится Saga для более сложных приложений (читай:« использует »), а промежуточное ПО Redux Promise для всего остального». )
• Обратите внимание, что есть важный случай, когда вы можете подумать, что вам нужно отправить несколько действий, но на самом деле это не так, и вы можете упростить простые вещи. Вот где вам просто нужно, чтобы несколько редукторов реагировали на ваш асинхронный вызов. Но нет никаких причин, по которым несколько редукторов не могут отслеживать один тип действия. Вы просто хотите убедиться, что ваша команда знает, что вы используете это соглашение, поэтому они не предполагают, что только один редуктор (со связанным именем) может обработать данное действие.

Полное раскрытие: я относительно новичок в разработке Redux и сам боролся с этим вопросом. Перефразирую самый емкий ответ, который я нашел:

ReduxPromise возвращает обещание в качестве полезной нагрузки при отправке действия, а затем промежуточное программное обеспечение ReduxPromise работает, чтобы выполнить это обещание и передать результат редуктору.

ReduxThunk, с другой стороны, заставляет создателя действия отложить фактическую отправку объекта действия редукторам до тех пор, пока не будет вызвана отправка.

Вот ссылка на руководство, в котором я нашел эту информацию: https://blog.tighten.co/react-101-part-4-firebase .