1
ich einen Code mit dem mitgelieferten Daten Wie SchriebErste Fehler wie Objekte sind nicht gültig als Reaktion Kind In ReactJs
var todos = [
{
task: 'A',
isComplete: false
},
{
task: 'B',
isComplete: true
}
]Und Erwartet Ausgabe wie ToDoList Aber immer Fehler Objekte sind nicht gültig als React Kind (gefunden: Objekt mit Schlüsseln {task, isComplete}). Wenn Sie eine Sammlung von untergeordneten Elementen rendern möchten, verwenden Sie stattdessen ein Array oder wickeln Sie das Objekt mit createFragment(object) von React um. Überprüfen Sie die Rendermethode von Todolist. Meine Codes sind
var todos = [
{
task: 'A',
isComplete: false
},
{
task: 'B',
isComplete: true
}
]
var App = React.createClass({
getInitialState:function(){
return ({
data:todos
});
},
render: function() {
return (
<div className="well">
<h1 className="well text-primary text-center">React ToDo App</h1>
<Todolist data={this.state.data}/>
</div>
);
}
});
var Todolist = React.createClass({
render: function() {
var abc = this.props.data.map(function(value){
return(
<td key={value}>{value}</td>
);
});
return (
<div>
<table className="table table-bordered">
<thead>
<tr>
<th>Task</th>
<th>IsCompleted</th>
</tr>
</thead>
<tbody>
<tr>
{abc}
</tr>
</tbody>
</table>
</div>
);
}
});
ReactDOM.render(
<App/>,
document.querySelector("#app")
);<script src="https://facebook.github.io/react/js/jsfiddle-integration-babel.js"></script>
<div id="app">
<!-- This element's contents will be replaced with your component. -->
</div>