数据结构
网络
RDBMS
操作系统
Java
MS Excel
iOS
HTML
CSS
Android
Python
C 编程
C++
C#
MongoDB
MySQL
Javascript
PHP
物理
化学
生物
数学
英语
经济学
心理学
社会学
时尚研究
法律研究ReactJS – getDerivedStateFromError() 方法
在本文中，我们将学习如何在组件中发生某些错误时执行某个函数。
当组件在 React 组件生命周期中遇到某些错误时会调用此方法。此方法允许我们处理应用程序的错误边界。为了避免性能问题，请不要在此方法中设置任何副作用。
语法
static getDerivedStateFromError(error)
它接受一个作为组件抛出的错误作为参数。
例子
在该示例中，我们将会构建一个 React 应用程序，该应用程序会在未发生错误的情况下显示包含的 Comp1 组件；否则，它会显示一些文本。但此处，在 Comp1 组件中，定义会发生错误，因为未定义状态，这种状态会在父组件中引发 getDerivedStateFromError。
App.jsx
import React, { Component } from 'react';
class App extends Component {
constructor(){
super();
this.state = {
err: false
};
}
static getDerivedStateFromError(error) {
// Changing the state if some error occurs
return {
err: true,
};
}
render() {
return (
<div>
{this.state.err ? <div>Some Error Occurred</div> : <Comp1 />}
</div>
);
}
}
class Comp1 extends Component {
render() {
return <h1>{this.state.data}</h1>;
}
}
export default App;输出
这将产生以下结果。
更新于： 18-Mar-2021
437 次浏览
广告