Impossible de mettre à jour l'état dans ReactJS

Je construis une visualisation de données où j'ai besoin de transmettre les données de l'API au composant graphique. Le composant graphique charge bien pour la première fois mais dans les tentatives ultérieures, la carte ne parvient pas à charger sans erreur. Je soupçonne que cela soit un problème avec les États mis à jour dans la composante graphique. Lors du débogage, je pouvais constater que l'État ne met pas à jour par intermittence en raison de laquelle le graphique ne charge pas. Voici ce que le code ressemble à

homepage.js strong> p> xxx pré>

dans le composant graphique, je reçois les données des accessoires et définissez la Etat et ma compréhension est que chaque fois que l'état change, le graphique devrait être redessiné (cela fonctionne, mais dans certains cas, l'état n'est jamais défini ni défini sur un objet vide en raison de laquelle le graphique n'est pas créé P>

Composant de graphique strong> P>

this.state = {
        chartData: {}
    };
}

componentDidUpdate() {
    let chartData = this.props.chartData;
    //Check before updating the state to avoid infinite dom updates
    if (chartData.labels.length > 0 && this.state.chartData.labels.length ===0) { 
      this.setState({ chartData: chartData });
    }
}

render() {
    return (
        <div className="chartContianer">
            <Line data={this.state.chartData}/>
        </div>
    );
  }