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 (将#修改为@)