Как достать данные API и поместить в хранилище с помощью redux-thunk?

Question

[rsoinvi]

Застрял на этапе redux-thunk
Хочу поместить данные с API в хранилище. Начал разбираться с redux-thunk. Но что то пока сложно.
Объясните на простом примере что это такое и с чем его едят)

Answer 1

[Роман Александрович]

export const endWorkingDay = () => (dispatch, getState) => {
			return axios.post(`${API_ROOT}/api/Account/EndWork?date=${endDate}&tradePointId=${id}&lat=${currentLat}&long=${currentLong}`,
					null,
					{
						headers: {
							Authorization: `Bearer ${token}`,
							"Content-Type": "application/json;charset=UTF-8",
						},
					}
				)
				.then(
response => {
					
					if (response.status === 200) {
						dispatch({
							type: SET_END_WORK_DATA,
							payload: {
								endWorkData: {
									tradePointId: id,
									lat: currentLat,
									long: currentLong,
									date: dateformat(new Date(), "yyyy-mm-dd"),
									synced: true,
								},
							},
						})

Делаем запрос а затем используем диспатч для передачи данных в стор.

Comments

[Антон Спирин]

Я бы все-таки рекомендовал использовать async/await:

const fetchData = () => async dispatch => {
  try {
    const data = await Api.fetchData();
    dispatch(fetchDataSuccess(data)); 
  } catch (e) {
    dispatch(fetchDataFail(e));
  }
};

А токен в заголовки по-умолчанию записать:

import Axios from 'axios';

const setupAxios = token =>
  (Axios.defaults.headers = {
    Authorization: `Bearer ${token}`,
  });

export default setupAxios;

Так опрятней и минималистичней будет.

[Роман Александрович]

Антон Спирин, логично. учту