Я экспортирую компонент без сопоставления отправки с реквизитами, подобными этому, , чтобы сделать диспетчеризацию доступной по умолчанию для реквизитов. :
export default connect(
mapStateToProps
)(Radium(ClientList));
У меня есть создатель следующих действий:
export function organizeDownloadableClientCustomerData(downloadableClientCustomerData) {
return {
type: 'ORGANIZE_DOWNLOADABLE_CLIENT_PAGE_DATA',
downloadableClientCustomerData: downloadableClientCustomerData
}
}
Когда я отправляю это:
componentDidMount() {
this.props.dispatch(this.fetchCustomerData());
}
Отправляет первое действие, которое я определил для actions.js:
export const navigate = eventLink => {
return {
type: 'NAVIGATE',
eventLink: eventLink
}
}
Что не имеет смысла вообще . Я знаю, что должен делать запросы API далеко от componentDidMount с помощью причудливой redux-saga, но я добираюсь до этого. Забавно, если я отправлю это так:
componentDidMount() {
this.props.dispatch({
type: 'ORGANIZE_DOWNLOADABLE_CLIENT_PAGE_DATA',
downloadableClientCustomerData: downloadableClientCustomerData
});
}
Это работает как шарм. Почему оно отправляет неправильное действие, если оно совершено через создателя действия ???
РЕДАКТИРОВАТЬ (fetchCustomerData):
fetchCustomerData() {
return dispatch => {
dispatch({ type: 'FETCH_DOWNLOADABLE_CLIENT_CUSTOMER_DATA_BEGIN' });
return fetch(`${backendAddress}/fetch_customers/?acquirer=${this.props.storeState.currentAcquirer}`)
.then(res => res.json())
.then(responseData => {
dispatch({
type: 'FETCH_DOWNLOADABLE_CLIENT_CUSTOMER_DATA_SUCCESS',
responseData: responseData
});
this.fitDataIntoPages(this.props.storeState.downloadableClientCustomerData.responseData);
return true;
})
.catch(error => {
dispatch({
type: 'FETCH_DOWNLOADABLE_CLIENT_CUSTOMER_DATA_ERROR',
payload: { error }
});
return false;
});
};
}
EDIT2:
fitDataIntoPages(data) {
...
let downloadableClientCustomerData = {
responseData: data,
organizedData: organizedData,
customerElements: customerElements,
totalItems: totalItems,
numberOfPages: Math.ceil(totalItems / this.props.storeState.downloadableClientCustomerData.pageCount)
}
this.props.dispatch(organizeDownloadableClientCustomerData(downloadableClientCustomerData));
}