小编KAT*_*KAT的帖子

如何初始化从API到变量的响应,以便我可以在我的render()函数中使用它？为什么component.setState不工作？错误:
未捕获TypeError:无法读取undefined(...)的属性'username'

class Main extends React.Component {
 constructor(props) {
     super(props);
    this.state = {
      data: 23
    };
 }

  componentDidMount() {
var component = this;


      fetch('https://fcctop100.herokuapp.com/api/fccusers/top/alltime')
          .then(function(response) {
              return response.json()
          }).then(function(json) {
              var data = json;
              console.log(data[0]);
              console.log(data[0].username);
              component.setState({
                  data: json
              })
          })

  }




  render() {
    return (
      <div>
        <h1>elo{this.state.data[0].username}</h1>


      </div>
    );
  }
}

const docs = document.getElementById('root');

ReactDOM.render( <Main/> , docs);

我想将 JSON 转换为 HTML 以在网站上显示它。我用谷歌搜索过，当 whenjson是一个字符串时会发生这个错误，首先我需要解析。但是当我使用时JSON.parse，控制台说它已经是一个对象（Unexpected token o in JSON at position 1）。

$(document).ready(function() {
  $("#getMessage").on("click", function() {??
    $.getJSON("http://quotes.rest/qod.json", function(json) {
      var html = "";

      json.forEach(function(val) {
        var keys = Object.keys(val);

        html += "<div class = 'blabla'>";

        keys.forEach(function(key) {
          html += "<b>" + key + "</b>: " + val[key] + "<br>";
        });

        html += "</div><br>";
      });

      $(".message").html(html);
    });
  });
});