时间戳

首页 > 解决方案 > 如何在反应组件中使用 window.onerror？

reactjs - 如何在反应组件中使用 window.onerror？

问题描述

我计划使用 window.onerror 将我的 reactjs 应用程序中的所有控制台错误记录到文件中。

所以我有应用程序启动的主要组件并创建了另一个组件ErrorLog，它将有这个window.onerror。但我不确定如何在反应组件中使用这个 window.onerror。有人可以帮我解决这个问题。谢谢。

下面是我的代码，

class ErrorLog extends react.purecomponent {
    state = {
        error_log: [];
    };

    componentDidMount() {
        window.onerror();
    }
    render = () => {
        return (
        );
    };
}

现在的问题是如何在 componentDidMount 生命周期钩子中定义 window.onerror 方法，以便它为我提供行号、消息和错误（基本上是登录文件所必需的）。

我不熟悉将这些 javascript 错误添加到日志文件中。有人可以帮我解决这个问题。谢谢。

标签： reactjs

解决方案

这个简单的添加事件监听器应该可以工作。 

class ErrorLog extends react.purecomponent {
     constructor(props) {
         super(props);
         this.state = {
            error_log: [];
         };

         this.handleErrorEnter = this.handleErrorEnter.bind(this);
    }

    componentDidMount() {
       window.onerror = this.handleErrorEnter;
    }

    componentWillUnmount() {
        //Remove here
    }

    handleErrorEnter = (message, source, lineno, colno, error) => {
        console.log("Error message, source, lineno, colno, error:", message, source, lineno, colno, error);
    }

    render = () => {
       return (
       );
    };
}

推荐阅读