我正在尝试使用用户代理将json设置为一种状态,但出现错误:
未捕获的不变违规:对象作为React子对象无效(找到:具有键{…}的对象)。如果您打算渲染孩子的集合,请使用数组代替,或者使用React附加组件中的createFragment(object)包装对象。
设置状态的方法:
getInitialState: function(){ return { arrayFromJson: [] } }, loadAssessmentContacts: function() { var callback = function(data) { this.setState({arrayFromJson: data.schools}) }.bind(this); service.getSchools(callback); }, componentWillMount: function(){ this.loadAssessmentContacts(); }, onTableUpdate: function(data){ console.log(data); }, render: function() { return ( <span>{this.state.arrayFromJson}</span> ); }
服务
getSchools : function (callback) { var url = 'file.json'; request .get(url) .set('Accept', 'application/json') .end(function (err, res) { if (res && res.ok) { var data = res.body; callback(data); } else { console.warn('Failed to load.'); } }); }
杰森
{ "schools": [ { "id": 4281, "name": "t", "dfe": "t", "la": 227, "telephone": "t", "address": "t", "address2": "t", "address3": "t", "postCode": "t", "county": "t", "ofsted": "t", "students": 2, "activeStudents": 2, "inActiveStudents": 0, "lastUpdatedInDays": 0, "deInstalled": false, "inLa": false, "status": "unnassigned", "authCode": "t", "studentsActivity": 0 },...... ]}
您无法执行此操作:{this.state.arrayFromJson}由于您的错误提示您尝试执行的操作无效。您正在尝试将整个数组呈现为React子级。这是无效的。您应该遍历数组并渲染每个元素。我曾经.map这样做。
{this.state.arrayFromJson}
.map
我粘贴了一个链接,您可以从那里学习如何使用React从数组渲染元素。
http://jasonjl.me/blog/2015/04/18/rendering-list-of-elements-in-react-with- jsx/
希望能帮助到你!