"data": {
"offset": 0,
"limit": 20,
"total": 1,
"count": 1,
"results": [
{
"id": 1009144,
"name": "A.I.M.",
"modified": "2013-10-17T14:41:30-0400",
"thumbnail": {
"path": "i.annihil.us/u/prod/marvel/i/mg/6/20/52602f21f29ec",
"extension": "jpg"
},
"resourceURI": "gateway.marvel.com/v1/public/characters/1009144",
"comics": {
"available": 33,
"collectionURI": "gateway.marvel.com/v1/public/characters/1009144/comics",
"items": [
{
"resourceURI": "gateway.marvel.com/v1/public/comics/36763",
"name": "Ant-Man & the Wasp (2010) #3"
},
{
"resourceURI": "gateway.marvel.com/v1/public/comics/17553",
"name": "Avengers (1998) #67"
}
]
}
}
]
}
axios를 사용하여 React 구성 요소 내부의 API에서 데이터를 가져옵니다. setState를 위해 json 응답의 주요 항목에 액세스하고 싶지만 할 수 없습니다.
export default class Hero extends React.Component {
constructor(props) {
super(props);
this.state = {
details : [],
comics :[]
};
}
componentDidMount() {
axios.get(infoUrl).then((res) => {
this.setState({details : res.data.data.results,
comics : res.data.data.results.results[6].items});
})
}
render() {
(<div>
</div>)
}
}
내 주 정보에는 액세스 할 수 있지만 만화 정보에는 액세스 할 수 없습니다.
결과 배열에는 항목이 하나만 포함되어 있으므로 0대신 인덱스를 사용해야 6합니다. items내부에 또 다른 것이 comics있으므로 먼저 액세스 comics한 다음 액세스 items하여 다음을 사용하십시오.
componentDidMount() {
axios.get(infoUrl).then((res) => {
this.setState({
details : res.data.data.results,
comics : res.data.data.results[0].comics.items});
})
}
이 스 니펫을 실행하십시오.
let data = {"data": {
"offset": 0,
"limit": 20,
"total": 1,
"count": 1,
"results": [
{
"id": 1009144,
"name": "A.I.M.",
"modified": "2013-10-17T14:41:30-0400",
"thumbnail": {
"path": "i.annihil.us/u/prod/marvel/i/mg/6/20/52602f21f29ec",
"extension": "jpg"
},
"resourceURI": "gateway.marvel.com/v1/public/characters/1009144",
"comics": {
"available": 33,
"collectionURI": "gateway.marvel.com/v1/public/characters/1009144/comics",
"items": [
{
"resourceURI": "gateway.marvel.com/v1/public/comics/36763",
"name": "Ant-Man & the Wasp (2010) #3"
},
{
"resourceURI": "gateway.marvel.com/v1/public/comics/17553",
"name": "Avengers (1998) #67"
}
]
}
}
]
}
}
console.log('items', data.data.results[0].comics.items)이 기사는 인터넷에서 수집됩니다. 재 인쇄 할 때 출처를 알려주십시오.
침해가 발생한 경우 연락 주시기 바랍니다[email protected] 삭제
몇 마디 만하겠습니다