ReactJS调用JSON API

ReactJS调用JSON API,json,reactjs,Json,Reactjs,在我的JSON文件中,我有几层数据要调用。如我的getInitState中所示,我的JSON数据被组织为{forthem:[{articles:[]}]}。您也可以在查看我的数据 第一个函数,在这里我使用变量fakeit按预期工作。但是,第二个函数(我调用makeit访问我的文章数据)不起作用。我得到一个无法读取未定义地图的错误 我已将我的完整代码包含在下面以供审阅 getInitialState:function(){ return {forname: '', forsym: '',

在我的JSON文件中,我有几层数据要调用。如我的
getInitState
中所示,我的JSON数据被组织为
{forthem:[{articles:[]}]}
。您也可以在查看我的数据

第一个函数,在这里我使用变量
fakeit
按预期工作。但是,第二个函数(我调用
makeit
访问我的
文章
数据)不起作用。我得到一个
无法读取未定义地图的错误

我已将我的完整代码包含在下面以供审阅

getInitialState:function(){
    return {forname: '', forsym: '', fortitle: '', fulldata: {forthem:[ {articles: [] } ]}  }
},

componentDidMount:function(){
    var self = this;
    $.getJSON('https://emjayweb.github.io/portfolio/scripts/snippets.json', function(snowden){
        self.setState({fulldata: snowden});
    });
},

render:function(){        
    return (<div id="madeforlist">
        <ul>
            {this.state.fulldata.forthem.map(function(fakeit, i){
                return <li key={i}>
                            <i className="fa fa-plus-circle" aria-hidden="true"></i>
                            <span id="forname">{fakeit.therefore}</span>
                            <span className="pull-right">{fakeit.theresym}</span>
                        </li>})}
            <ul>
            {this.state.fulldata.forthem.articles.map(function(makeit, o){
                return <li key={o}>{makeit.article}</li>
                })}
            </ul>
        </ul>    
    </div>);
}
getInitialState:function(){
返回{forname:'',forsym:'',fortitle:'',fulldata:{forthem:[{articles:[]}]}
},
componentDidMount:function(){
var self=这个;
$.getJSON('https://emjayweb.github.io/portfolio/scripts/snippets.json,函数(斯诺登){
self.setState({fulldata:snowden});
});
},
render:function(){
返回(
    {this.state.fulldata.forthem.map(函数(fakeit,i)){ return
  • {fakeit.so} {fakeit.theresym}
  • })
      {this.state.fulldata.forthem.articles.map(函数(makeit,o){ return
    • {makeit.article}
    • })}
); }
无法读取未定义的映射
错误是
this.state.fulldata.forthem.articles.map()的原因。
文章
未定义的


我想知道GitHub.io是否支持跨域?如果没有,则此代码无法工作,因为getJSON无法从gist获取数据。

无法读取未定义的映射
错误是导致
this.state.fulldata.forthem.articles.map()
的原因。
articles
未定义的


我想知道GitHub.io是否支持跨域?否则,此代码将无法工作,因为getJSON无法从gist中获取数据。

forthem
是一个数组,因此您需要传递一个索引才能获取数组文章

请尝试
this.state.fulldata.forthem[0].articles.map()


forthem
是一个数组,因此您需要传递一个索引来获取数组项目

请尝试
this.state.fulldata.forthem[0].articles.map()


我能够从我的Github进行API调用。唯一的问题是,
文章
没有定义。我不知道如何使用map函数在React中定义它。编辑:明白了!我能够从我的Github进行API调用。唯一的问题是,
文章
没有定义。我不知道如何使用map函数在React中定义它。编辑:明白了!所以这是可行的。但是,我似乎只能调用[0]。如果我用[1]替换这篇文章,我会得到一个未定义的
错误。这样就行了。但是,我似乎只能调用[0]。如果我将其替换为[1],我会得到一个未定义的
文章。
this.state.fulldata.forthem.map(function(fakeit,i){

   fakeit.articles.map(function(article,j){

   })   
})