状态的array.map 问题

Question

S0 我试图在组件安装之前将一组对象设置为状态，然后在渲染时循环遍历这些对象。 但我似乎无法让 array.map 工作。 建议？

编码：

import React, { Component } from 'react';
import axios from 'axios';

export default class ComponentContainer extends Component {
    constructor(props) {
        super(props);

        this.state = {
            apiData: []

        }
    }

    componentWillMount() {
        axios.get(localStorage.getItem('menu_url'))
            .then(response => {
                this.setState({ 'apiData': response.data.view.sections }); (This is an array, currently with 1 object in it)
            });
    }

    render() {

        console.log('Axios response to state:', this.state.apiData); (this works, and show the 1 object)

        return (
            <div>
                <p>test</p>
                {this.state.apiData.map((index, sections) => (
                    <p key={index}>Value: {sections}</p> (this is where i have the issue)
                ))}
            </div>
        )
    }
}

所以状态 apiData 是一个单一的对象（可能有很多），我需要深入到该对象中，其中包含另一个对象数组（我认为是 12 个），这些对象是我需要显示数据的对象。

这是我迷路的地方。

Answer 1

嘿索引和部分的顺序不正确。 将其更改为此，这应该可以工作：

{this.state.apiData.map((sections, index) => (
                    <p key={index}>Value: {sections}</p> (this is where i have the issue)
                ))}