Не совсем понял ваш вопрос, но thunk middleware никак не влияет на редьюсер.
Redux-thunk - это всего лишь вспомогательная функция для ваших экшен-крейтеров (или просто экшенов, как удобнее). Если посмотреть на
исходный код, то можно описать его так: если AC (экшен, экшен крейтор, создатель действия...) возвращает простой объект - прокидывай его дальше, если возвращает функцию, то "прокинь" в эту функцию
dispatch и
getState функции в качестве аргументов. Например, это дает нам возможность работать с асинхронными запросами. Так как, чтобы достучаться до reducer'a мы же должны использовать функцию dispatch. А если бы не было redux-thunk, то откуда бы она взялась у нас в коде экшена: импорта в файл нет, нигде не описано, что
const dispatch = ...?
Приведу пример:
export function logout {
return {
type: LOGOUT_SUCCESS,
}
}
AC возвращает простой объект, который (если нет других middleware влияющих на работу) - сразу попадает в reducer.
export function login(data) {
return dispatch => {
dispatch({ type: LOGIN_REQUEST })
return request.post(`${API_ROOT_V1}/auth/signin`)
.send(data)
.then(res => {
if (!res.ok) {
dispatch({ type: LOGIN_FAILURE })
dispatch(showNotification({
status: 'err',
text: 'something going wrong',
}))
} else {
dispatch({
type: LOGIN_SUCCESS,
data: res.body.data,
})
localStorage.setItem('cks_token', res.body.data)
dispatch(push('/'))
}
}, err => {
dispatch({ type: LOGIN_FAILURE })
dispatch(showNotification({
status: 'err',
text: err.body && err.body.error || err.message,
}))
})
}
}
Особое внимание на
return dispatch => { - это значит, что АС возвращает функцию, а следовательно в этой функции из-за redux-thunk доступен dispatch. Если вводит в заблуждение ES2015 синтаксис, то это можно было бы написать как
return function(dispatch) { ...
P.S. Опишите подробнее, что вы имеете в виду под "А как разделить логику обработки?"
Простой