資料結構
網路
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 次瀏覽
廣告