エラー：既にマウント解除された（またはマウントに失敗した）コンポーネントを更新しようとしました

Question

私はReactに新しいです、このエラーのために私のアプリをレンダリングするのに問題があります。それは私が要素としてレンダリングしようとしているデータは、マウントされていない状態を設定しようとするためレンダリングされないようですか？

Dataの状態をcomponentdidmountに設定しているので、どのようにこのエラーが発生するのかわかりません。この問題を解決するにはどうすればよいですか？

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; 

Answer 1

レンダリング機能では、this.setState({mounted:true})を呼び出しています。リアクトコンポーネントのマニュアルから：

The render() function should be pure, meaning that it does not modify component state, it returns the same result each time it's invoked, and it does not directly interact with the browser.

ここlinkはレンダリング機能と反応のドキュメントにあります。