ReactJS getDerivedStateFromError() 方法

如果在任何生命周期方法或任何子组件的渲染阶段发生错误，则调用 getDerivedStateFromError() 方法。此方法用于实现 React 应用程序的错误边界。它在渲染阶段被调用，所以这个方法中不允许有副作用。对于副作用，请改用 componentDidCatch()。

句法：

static getDerivedStateFromError(error)

参数：它接受作为参数抛出的错误。

创建反应应用程序：

第 1 步：使用以下命令创建一个 React 应用程序：

npx create-react-app foldername

第 2 步：创建项目文件夹（即文件夹名称）后，使用以下命令移动到该文件夹：

cd foldername

示例：演示使用 getDerivedStateFromError() 方法的程序。

项目结构：它将如下所示。

文件名：App.js

Javascript

import React, { Component } from 'react';
 
export default class App extends Component {
 
  // Initializing the state
  state = {
    error: false
  };
 
  static getDerivedStateFromError(error) {
    // Changing the state to true if some error occurs
    return {
      error: true,
    };
  }
 
  render() {
    return (
      
        

          {this.state.error ? 
Some error
 : }
        
      
    );
  }
}
 
class GFGComponent extends Component {
 
  // GFGComponent throws error as state of GFGCompnonent is not defined
  render() {
    return 
{this.state.heading}
;
  }
}

运行应用程序的步骤：从项目的根目录使用以下命令运行应用程序：

npm start

输出：

参考： https://reactjs.org/docs/react-component.html#static-getderivedstatefromerror