我试图使用用户代理将json设置为一种状态,我得到错误:

未捕获不变冲突:对象作为React子对象无效(找到:具有键{…}的对象).如果要呈现子对象集合,请使用数组,或者使用React附加组件中的createFragment(object)包装对象.

method to set state:
 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>
    );
}
service
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.');
                }
            });
    }
Json
{
"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
},......
]}

推荐答案

正如你的错误所暗示的:你不能做的就是你的错误.您正在try 将整个数组渲染为子array.这是无效的.您应该遍历数组并渲染每个元素.我用.map来做这个.

我正在粘贴一个链接,从中可以学习如何使用React渲染数组中的元素.

http://jasonjl.me/blog/2015/04/18/rendering-list-of-elements-in-react-with-jsx/

希望有帮助!

Reactjs相关问答推荐

面对动画警告:未指定`useNativeDriver`.这是必需的选项,并且必须在REACT本机中显式设置为`true`或`False`

FireBase未与Reaction应用程序连接

更改滑块标记的文本 colored颜色 ./Reaction/MUI 5

REACTION-Easy-SORT返回.map错误

react -无法获取函数的最新参数值

无法在下一个标头上使用 React hooks

如何垂直对齐 React Bootstrap Table 行中的项目

错误:无法获取 RSC 负载.返回浏览器导航

React redux 工具包 useGetFilterProductsQuery 和 useGetFilterProductsByCategoriesQuery 未定义为函数

在reduce()方法上得到NaN

提前输入错误:选项类型上不存在属性名称

显示我是否加入聊天应用程序时出现问题

无法在react 中向表中添加行

使用 Vite 的 React 中的路由无法正常工作(构建中)

如何通过onpress on view in react native flatlist来降低和增加特定视图的高度?

从一个获取 axios 请求(ReactJS)中删除默认参数

如何将值从下拉列表传递到 select 上的输入?响应式JS

将 Material UI 菜单渲染为

如何在 React 中的 Material Ui 多选中设置默认值?

网格项不缩小以适应包含的可滚动列表