看到Called setState() on an Unmounted Component在您的控制台是面对新人反应最常见的问题之一。当您使用类组件时,您可以轻松地创建遇到此错误的情况。
更新已从 DOM 中删除的组件的状态通常表明您的应用程序存在内存泄漏。这会浪费用户的硬件资源,如果不加以控制,将导致性能逐渐下降。这就是发生错误的原因以及您可以采取的措施来解决它。
一个简单的组件
这是一个基本的 React 组件,它通过网络获取一些数据:
import React from "react"; class NewsList extends React.Component {
state = {
news: null };
componentDidMount() {
fetch("http://example.com/news.json").then(res => {
this.setState({
news: response.json()});
}).catch(e => {
alert("Error!");
});
}
render() {
if (!this.state.news) return "Loading...";
else return news.map((story, key) => <h1 key={
key}>{
story.Headline}</h1>