首页 > 解决方案 > 如何在反应中处理带有消息的错误代码

问题描述

在 Angular 中,我们有类似 mport {HttpClient, HttpErrorResponse, HttpHeaders} from "@angular/common/http";

所以当我们使用 http 和 Rxjs 进行 post 调用时,就像下面的代码一样。我们有一个叫做 ErrorEvent 的东西。

private runBuild(jobName: string, payload: string) {
        return this.http.post(this.jenkinsURLs.runJobUrl(jobName), "json=" + encodeURIComponent(payload), httpOptions)
            .pipe(catchError(this.handleError));
    };

    private handleError(error: HttpErrorResponse) {
        let errorMessage: string = '';
        ***if (error.error instanceof ErrorEvent) {
            errorMessage = 'An error occurred: ' + error.error.message;
        } else {
            errorMessage = `Jenkins returned code ${error.status}, body was: ${error.message}`;
        }***
        return throwError(errorMessage);
    };

但作为反应,如果我想为不同的错误代码提供不同的消息,我必须手动完成,因为我们没有像 ErrorEvent 这样的东西。

您能否建议任何通用的方式来获得某种 ErrorEvent 以便我可以通过在反应中验证 instanceOf 运算符来分配不同的消息

标签: reactjs

解决方案


您可以使用 <ErrorBoundary> 包装 <App />(或在其他相关位置仅包装一次),这将触发在 componentDidCatch 生命周期中执行某些操作。此 lifeCycle 中的 {((error, errorInfo)} 参数可以是假设显示的拟合错误的处理程序 - https://reactjs.org/docs/error-boundaries.html


推荐阅读