Wie machen im Browser reagieren

Question

Ich habe eine Funktion, die wie so durch einige Versprechungen und setState geht:

}).then((future_users) => { 
     this.setState({future_users: future_users}); 
     console.log(this.state.future_users, 'tsf'); 
    }); 

diese ein Array von drei Objekten abmeldet viel weiter unten in meiner Render-Methode Ich habe

<p><span id="users"></span></p> 
{this.state.future_users.map(function(item){ 
    return (<span>{item}</span>); 
})} 

jedoch bekomme ich eine Fehlermeldung, Objects are not valid as a React child , wo ich sie in Strings oder so umwandeln kann?

Answer 1

Wenn das, was du gesagt hast wahr ist, ein Array von Objekten ist, was future_users ist, dann Sie Sie versuchen zu tun <span> {object} <span> die nicht funktionieren, müssen Sie sie auf die Eigenschaft des Objekts einstellen, das Sie anzeigen möchten. zum Beispiel, wenn Ihr Benutzer eine userName Eigenschaft hat, können Sie tun:

<p><span id="users"></span></p> {this.state.future_users.map(function(item){ return (<span>{item.userName}</span>); })}

und es würde gut funktionieren. Sie können das Objekt selbst nicht in die Rendermethode einfügen.

Answer 2

Sie müssen überprüfen, ob this.state.future_users mit der geladenen Daten sind:

{this.state.future_users && this.state.future_users.map(function(item){ 
    return (<span>{item}</span>); 
})}