时间戳

首页 > 解决方案 > 无法调用 JSON 对象的第一个元素

javascript - 无法调用 JSON 对象的第一个元素

问题描述

我正在尝试从data[]. 然后，抓住钥匙使用Object.keys()，但它给了我这个错误：

“TypeError：无法将未定义或 null 转换为对象”。

我需要输出是一个键数组。

import React, { Component } from 'react';

class CodecChart extends Component {

  constructor(props) {
    super(props);
    this.state = {
      post: [],
      isLoaded: false,

    }
  }

  componentDidMount() {
    const url = 'https://jsonplaceholder.typicode.com/users';
    fetch(url)
      .then(result => result.json())
      .then(post => {this.setState({ post: post })
      })
  }

  render() {
    const data = this.state.post;

// cannot reach the first object of data[]
    var keys = Object.keys(data[0]);


    return (
      <div>

//output should be an array of the keys
        <h5>{keys}</h5>

      </div>
    )
  }
}

export default CodecChart;

标签： javascriptjsonreactjsapi

解决方案

第一次尝试访问data[0]时，它仍然是空的：

this.state = {
  post: [],
  isLoaded: false,
}

并且const data = this.state.post;意味着这data[0]是未定义的。

只有在安装组件之后，并且正确设置了data[0]已定义的状态（或未正确设置，取决于 API 返回的内容）。

推荐阅读