J'ai un composant de réact simple, laissez l'utilisateur de télécharger le fichier CSV à l'aide de React-CSV-Reader, puis de la télécharger sur la base de données. Comment attribuer des données CSV à l'état dans réagir? Je rencontre l'erreur IT Impression avec succès Console à la ligne Il s'agit des données CSV imprimées avec succès dans la console. P> importateur.jsx: 23 non capote TypeError: impossible de lire la propriété 'State' de indéfini code> lorsque j'ai lu les données de l'état. console.log (data.length); code> et console.log (données); code>. Cependant, je pense que cela ne parvient pas à affecter les données CSV à l'état. P> 0: (11) ["identifier", "postal", "volume", "weight", "service_time", "phone", "customer_name", "window_start", "window_end", "lat", "lng"]
1: (11) ["SN48164550", "089952", "1", "1", "15", "90648664", "Customer 860", "2018-10-11 10:00:00", "2018-10-11 13:00:00", "1.27601", "103.836"]
2: (11) ["SN78463977", "269836", "1", "1", "15", "92656072", "Customer 517", "2018-10-11 16:00:00", "2018-10-11 19:00:00", "1.31924", "103.797"]
3: (11) ["SN16822741", "559782", "1", "1", "15", "94274895", "Customer 202", "2018-10-11 12:00:00", "2018-10-11 15:00:00", "1.36392", "103.861"]
3 Réponses :
Il semble que handleclick code> n'est pas lié, par conséquent ce code> est indéfini à l'intérieur.
Utilisez à la place: handleClick = () => {
console.log("success");
console.log(this.state.data);/*this is where error occur*/
}
Votre Handleclick code> Le gestionnaire n'est pas limité, donc accédant à Ceci code> à l'intérieur de celui-ci ne fonctionnera pas. Il vous suffit de le lier dans le constructeur ou de l'utiliser une fonction de flèche. constructor(props) {
super(props);
this.state = {data:[]};
this.handleClick = this.handleClick.bind(this);
}
Comme les gars ont déjà dit que votre handleclick code> n'est pas lié à ceci code>
Donc, pour résoudre ce problème, vous devez le lier en modifiant votre clic sur constructor(props) {
super(props);
this.state = {data:[]};
this.handleClick = this.handleClick.bind(this);
}