在React中捕获后端返回的错误

Question

全部，我正在使用带有打字稿的react redux。所以，当后端返回错误时，我就不要了，因为它是从后端返回的错误消息。在我的Api失败时返回此错误。

这是我的api调用，功能 ，

   /**
 * @function createSalesContact
 * @export
 * @param {Array<ISalesContact>} salesContact
 * @returns {Promise<ISalesContactListItem[]>}
 */
export function createSalesContact(salesContact: Array<ISalesContact>): Promise<ISalesContactListItem[]> {
    return contactBookApiCalls.createSalesContacts(salesContact);
}

这是我的动作，

/**
 * @function crateSalesContact
 * action of create new sales contact
 * @param {Array<ISalesContact>} salesContact
 * @returns
 */
export const crateSalesContact = (salesContact: Array<ISalesContact>) => {
    return (dispatch: Dispatch, states: () => ISalesContactStoreState) => {
        dispatch(requestAddNewContact());

        createSalesContact(salesContact)
            .then(onSuccess)
            .catch(onError);

        function onSuccess(response: ISalesContactListItem[]) {
            dispatch(addToast("success", { text: "Sales Contact Created successfully" }))
            dispatch(addNewContactSuccess());
            dispatch(togglePage({ page: 'salesContact', action: 'View', 
            editId: response[0].Data.SalesContactId }));

        }

        function onError(error: any) {
            dispatch(addNewContactError(error));
        }
    };
};

所以我不会收到“需要名字”错误。那有什么可能的方法

Answer 1

我为此找到了一些工作机会。这是我的解决方案。

我这样更改Action错误方法。

function onError(response: Response) {
        if (response.status === 500) {
            return response.json() 
                .then((json) => {

                    dispatch(addToast("error", { text: json.Message }));
                    dispatch(recieveSalesContactUpdateError(json.Message));

                    console.log(json.Message)
                });
        } else {
            return response.json();
        }
    }