Question

我从以下端点得到响应：

[[{"1":"91"}],[{"1":"1"}],[{"1":"0"}],[{"1":"0"}],[{"1":"0"}],[{"1":"0"}],[{"1":"0"}],[{"1":"0"}]]

我获取了它们，但得到了结果，但无法渲染它们。这就是我一直在尝试的：

render() {
        const {count} = this.state;
        return (
            <div>
                {count.count && count.count.map(item => (
                    item.value.map(data => (
                        data.value.map(x => (
                            <p>{x.value}</p>
                        ))
                    ))
                ))}
            </div>
        )
    }

我希望out是json响应中显示的所有数字。例如91 1 0 0 0等。

Answer 1

首先，您要迭代的数组的结构就像一个数组，其中包含对象。因此，首先开始迭代第一个和第二个数组，然后迭代其中的对象。 Object.keys可用于此目的。

您可以按以下方式访问它，

...
    <div>
      {count &&
        count.length > 0 &&
        count.map(
          item =>
            item.length > 0 &&
            item.map(
              el =>
                Object.keys(el).length > 0 &&
                Object.keys(el).map(val => <p>{el[val]}</p>)
            )
        )}
    </div>
...

Codesandbox演示here

Stackblitz演示here

如何渲染嵌套数组？

1 个答案: