Question

我正在尝试列出服务器响应，但有些错误是我的代码中有关访问嵌套json的问题。以下是json的结构

更新

  {
    "child": [],
    "courses": [{
        "data": {
            "name": "Student 1",
            "date_created": 1514610451,
            "total_students": 4,
            "seats": "",
            "start_date": false,
            "categories": [{
                "name": "Subject",
                "slug": "Subject"
            }],
            "intro": {
                "id": "1",
                "name": "Main Admin",
                "sub": ""
            },
            "menu_order": 0
        },
        "headers": [],
        "status": 200
    }]
  }

我的反应部分是

render(){
        return this.state.course.map(course =>
        <Text style={styles.userStyle}>{course.courses.data.map(datas => datas.name)}</Text>
        );
    }

请帮我弄清楚错误。我得到this.state.course.map不是函数。我的获取请求如下

state= {course:[]};
    componentWillMount(){
        fetch('https://www.mywebsite.com/' + this.props.navigation.state.params.id)
        .then((response) => response.json())
        .then((responseData) => this.setState({course: responseData}))
    }

Answer 1

因此，您需要向我们展示如何设置this.state，但如果您正在执行this.setState(jsonObject)之类的操作，那么您要查找的属性似乎是this.state.courses。这将访问一系列课程。但是，在后续行中，您尝试访问course.courses，这表示您正在设置状态this.seState({course: jsonObject})，因此不清楚。

我说如果您解决了第一个问题，那么您会立即点击另一个问题，因为它看起来不像data是一个数组而是一个对象，所以试图调用关于它的map不太可能做你想要的（除非你一直在玩原型）。

编辑：

在回复新信息时，我建议如下：

    render(){
         if(this.state.course && this.state.course.courses) {
            return this.state.course.courses.map(course =>
            <Text style={styles.userStyle}>{course.data.name}</Text>
            );
        } else {
           return [];
        }
   }

如何在反应原生中访问jsx组件中的嵌套json？

1 个答案: