如何解决React nobelprizes API:如何将所有获奖者打印一年?
我正在使用nobelprizes.org的api之一来检索一些数据。
某些年份的奖项被授予多个获奖者。
在React中,我可以将一年的状态与一个名称的状态匹配,但不能将以下名称匹配,因此我无法检索其他名称。
这是终点:
{
"laureates": [
{
"id": "745","kNownName": {},"givenname": {
"en": "A. Michael","se": "A. Michael"
},"familyName": {
"en": "Spence","se": "Spence"
},"fullName": {
"en": "A. Michael Spence","se": "A. Michael Spence"
},"gender": "male","birth": {},"links": {
"rel": "laureate","href": "http://masterdataapi.nobelprize.org/2/laureate/745","action": "Get","types": "application/json"
},"nobelPrizes": [
{
"awardYear": "2001","category": {
"en": "Economic Sciences","no": "Økonomi","se": "Ekonomi"
},
这是我的React代码:
class Cards extends Component {
state = {
allCards: [],searchYear: '',searchName: ''
}
//Search laureates axios api
searchAll = async (searchYear,searchName) => {
await axios.get(`http://api.nobelprize.org/2.0/laureates?name=${searchName}&nobelPrizeYear=${searchYear}&nobelPrizeCategory=${category}`)
.then(res => { //both values are retrieved in the console but not in the render() method
const nameMatch = res.data.laureates[0]?.kNownName?.en
const yearMatch = res.data.laureates[0]?.nobelPrizes[0]?.awardYear
this.setState({
allCards: res.data.laureates,searchName: nameMatch,searchYear: yearMatch
})
})
.catch(err => console.log(err))
};
render() {
let filterCards = this.state.allCards.filter(card => {
return ( //the return method doesn't return the values
//associated with the state values
card.laureates ?
card.laureates[0]?.kNownName?.en.includes(searchName) ||
card.laureates[1]?.kNownName?.en.includes(searchName)
: null
)
})
.map((card) => {
return <WinnerCard
key={card.id}
name={card.laureates[0]?.kNownName?.en}
name1={card.laureates[1]?.kNownName?.en}
/>
});
return (
<div>
<SearchBar searchAll={this.searchAll} />
</div>
<div>
{filterCards}
</div>
</div >
)
}
}
export default Cards;
我可以出示带有名字但不能有多个名字的卡片,而且我不确定如何在同一年显示具有相同奖项的多个获奖者。
如何检索所有名称?
谢谢您的帮助!
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。