Диспетчеризация ошибки с редуксом не работает

Question

Я пытаюсь отправить ошибку с redux для рендеринга на интерфейс, но я ничего не получаю

Answer 1

export const callApi = payload => dispatch => {
  return new Promise((resolve, reject) => {
    post(`/newlist`, payload)
     .then(response => {
       resolve(response);
     })
     .catch(error => {
       dispatch({
        type: CONSTANTS.EX_ERROR,
        payload: error,
       });
       reject(error);
     });});};

Answer 2

Вы должны на самом деле поймать ошибку, она не вернется в теле. См. Ниже;

return new Promise((resolve, reject) => {
    post(url, payload, (err, res) => {
        if (err) {
            dispatch({
                type: CONSTANTS.EX_ERROR,
                payload: err
            });
            reject(err);
            return;
        }
        resolve(res);
    }).catch((err) => {
            dispatch({
                type: CONSTANTS.EX_ERROR,
                payload: err
            });
        });
});

Редактировать: только что увидел ошибку вашего типа - вам нужно обернуть компонент, в котором вы используете эту функцию, в функцию mapDispatchToProps, это прикрепит функцию диспетчеризации к вашим действиям с избыточностью. Вы также можете передать функцию в магазин, но я бы не рекомендовал такой подход. Ниже приведена базовая реализация этого.

export class YourComponent extends React.PureComponent<Props, State> {

    state = {

    }

    public render() {
        return (
            </div>
        );
    }
}

const mapDispatchToProps = (dispatch: any) => {
    return {
        myActions: bindActionCreators<any, any>(myActions, dispatch)
    }
}

export default connect(null, mapDispatchToProps)(YourComponent);

Вы будете называть свои действия с помощью реквизита, например, this.props.myActions.callMyAction(data)

В рамках вашего действия вам также необходимо будет вернуть диспетчер, например,

return (dispatch: any) => {
    return new Promise((resolve, reject) => {
    post(url, payload, (err, res) => {
        ...
        resolve(res);
    }).catch((err) => {
            dispatch({
                type: CONSTANTS.EX_ERROR,
                payload: err
            });
        });
});
}