Когда использовать диспетчеризацию против возврата в действиях?

Question

Я немного сбит с толку, когда дело касается диспетчерских действий. В действиях иногда я вижу это:

export const getConfig = () => dispatch => {
    const res = await axios.get('/api/users');
    dispatch({
        type : TYPES.GET_CONFIG,
        payload : res.data
    });
}

, а иногда вижу:

export const getConfig = () => {
    const res = await axios.get('/api/users');

    return{
        type : TYPES.GET_CONFIG,
        payload : res.data
    };
}

Они оба одинаковые? или у них есть свои варианты использования? Когда использовать что?

Спасибо.

Answer 1

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

Пример:

return{
    type : TYPES.GET_CONFIG,
    payload : res.data
};

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

Пример:

dispatch({
    type : TYPES.GET_CONFIG,
    payload : res.data
});

thunk - это концепция в программировании, где функция используется для задержки оценки / вычисления операции.

Пояснение Справочная информация

Answer 2

Redux не поддерживает побочные эффекты из коробки. Для побочных эффектов в Redux вы должны использовать дополнительные библиотеки. Например:

• Redux-thunk (первый пример в вашем вопросе);
• Redux-saga;
• Redux-observable.

Другими словами, если вам нужны побочные эффекты (запросы к API и т. Д. c.) Или Вы хотите вызвать два или более действия, а затем использовать первый пример кода, если нет - второе.

Я надеюсь, что смогу вам помочь.