erreur: tentative de mise à jour du composant qui a déjà été démonté (ou n'a pas pu être monté)
Je suis nouveau à Réagir, je vais avoir de la difficulté à rendu mon application en raison de cette erreur. Il semble que les données que j'essaie de rendre, en tant qu'éléments ne sont pas rendues en essayant de définir l'état lors de la montée?
Je ne suis pas sûr de savoir comment j'obtiens cette erreur, que je suis réglage de l'état de Data
dans componentDidMount
.
Comment puis-je résoudre ce problème?
error: attempted to update component that has already been unmounted (or failed to mount)
class Profile extends React.PureComponent {
static propTypes = {
navigation: PropTypes.object,
handleLogout: PropTypes.func,
user: PropTypes.object,
};
static navigationOptions = {
headerVisible: true,
title: 'Profile',
};
constructor(props) {
super(props);
this.state = {
data: [],
loading: true
};
}
componentDidMount() {
fetch("http://10.0.2.2:8080/combined", { method: 'get' })
.then(response => response.json())
.then(data => {
this.setState({data: data,});
})
.catch(function(err) {
//
})
}
render() {
const { user } = this.props;
let email;
if (user) {
email = user.rows[0].ACCTNO;
}
return (
<ContentWrapper>
<View style={styles.container}>
<Image style={styles.header} source={images.profileHeader} />
<View style={styles.body}>
<Avatar email={email} style={styles.avatar} />
{
this.state.data.map(function(rows, i){
this.setState({mounted: true});
return(
<View key={i}>
<Text>{rows.FIRSTNAME}</Text>
</View>
);
})
} <Text style={styles.email}>{_.capitalize(email)}</Text>
<Button
title="Log out"
icon={{ name: 'logout-variant', type: 'material-community' }}
onPress={this.logout}
style={styles.logoutButton}
/>
</View>
</View>
</ContentWrapper>
);
}
}
export default Profile;
source d'informationauteur Joseph Sortino
Vous devez vous connecter pour publier un commentaire.
Dans votre fonction rendu, vous appelez
this.setState({mounted:true})
. De Réagir de la documentation du composant:Voici la lien à Réagir de la documentation sur la fonction rendu.
Il est une autre façon cette erreur peut se produire...en pensant que les accessoires sont des arguments d'accessoires, est en fait un seul argument)
Mon problème est que j'oublie
dans mon
.jsx
fichier, car je pensais l'importation de Réagir n'est pas nécessaire dans la composante fonctionnelle.Mon problème a été en Sider, Puis à l'intérieur de la balise Lien je n'ai mal orthographié au lieu de /emplacement que j'ai écrit /locaion .