警告：无法对未安装的组件（多个组件）执行 React 状态更新
Posted
技术标签:
【中文标题】警告：无法对未安装的组件（多个组件）执行 React 状态更新【英文标题】：Warning: Can't perform a React state update on an unmounted component (multiple components) 【发布时间】：2019-11-18 11:59:55 【问题描述】：反应原生
我正在使用导航在与此相同的组件之间移动，但 ID 不同。有些有效，有些无效，React Native 会向我显示此警告。
警告：无法对未安装的组件执行 React 状态更新。这是一个空操作，但它表明您的应用程序中存在内存泄漏。要修复，请取消“componentWillUnmount 方法”中的所有订阅和异步任务。
我的组件的代码：
class MotosbicisScreen extends Component
static navigationOptions =
title: 'Motos y bicis',
;
constructor(props)
super(props);
this.state =
data: [],
;
componentDidMount()
this.getData()
getData = async () =>
const url = 'https://url';
fetch(url).then((response) => response.json())
.then((responseJson) =>
this.setState(
data:responseJson
)
)
renderRow = (item) =>
if (item.rubroClasificado == 9)
if(item.imageJob == null)
return(
<Card>
<CardItem>
<Body>
<Text>
item.Texto
</Text>
</Body>
</CardItem>
</Card>)
else
img = 'http://url/' + item.imagepath;
return(
<View style=styles.item>
<Image
source= uri: img
width=Dimensions.get('window').width
/>
</View>
)
render()
return (
<View style=styles.container>
<FlatList style=styles.container
data=this.state.data
renderItem=this.renderRow
keyExtractor=(item, index) => index.toString()
/>
</View>
);
【问题讨论】：
【参考方案1】：这是由于组件在卸载组件时调用setState（您已导航离开页面）。
过去的解决方案是在调用 setState 之前跟踪组件是否已挂载，但这是不好的做法。
以下文章涵盖了您的问题、旧的不良做法以及一种可能的解决方案。 (https://reactjs.org/blog/2015/12/16/ismounted-antipattern.html)
【讨论】：
以上是关于警告：无法对未安装的组件（多个组件）执行 React 状态更新的主要内容，如果未能解决你的问题，请参考以下文章
“警告：无法对未安装的组件执行 React 状态更新。” [关闭]
警告：无法在 React 本机中对未安装的组件执行 React 状态更新
React-Apollo - 查询 - renderProp：反应警告：无法对未安装的组件执行反应状态更新