Javascript 将JS映射到API

我正在尝试在我的项目中使用Meetup API。但无法与之联系。映射可能有问题。我想知道给定json格式的精确映射。请帮帮我。感谢

从'React'导入React，{Component}；
{
    "results": [
        {
            "name": "Arts & Culture",
            "sort_name": "Arts & Culture",
            "id": 1,
            "shortname": "Arts"
        },
        {
            "name": "Book Clubs",
            "sort_name": "Book Clubs",
            "id": 18,
            "shortname": "Book Clubs"
        },
        {
            "name": "Career & Business",
            "sort_name": "Career & Business",
            "id": 2,
            "shortname": "Business"
        }
]
}

从“axios”导入axios；
类Meetups扩展了组件{
状态={
结果：[]
}
componentDidMount（）{
axios.get（）https://api.meetup.com/2/categories?offset=0&format=json&photo-主机=public&page=20&order=shortname&desc=false&sig_id=211627025&sig=ae69aec13f23c7837cd55c5a68b99e00719fa225'）
。然后（响应=>{
让结果=response.data.results；
this.setState（{results:results}）；
控制台日志（响应）；
})
}
render（）{
让学生显示=(
this.state.results.map（（结果，索引）=>
{result.name}


{result.shortname}
));
返回(
{
学生节目
}
);
}
}
导出默认会议；

您希望得到什么？json文件的名称是

axios.get（…）

引发异常？尝试在

之后添加
.catch（..）
处理程序。然后（data=>this.setState（{results:data.results}））

并查看是否调用了它。-换句话说，这里可能没有调用

setState（…）

。加载失败：请求的资源上没有“Access Control Allow Origin”头。因此，不允许访问源“”。如

所述，Meetup API支持CORS规范，该规范允许托管在API.Meetup.com以外的域上的浏览器客户端直接与API通信。API使用OAuth使用者重定向URI来验证请求的来源，因此您必须使用OAuth才能从CORS中获益。

因此基本上，您需要获得授权或使用JSONPAn对上述代码进行解释，而不仅仅是代码本身

{
    "results": [
        {
            "name": "Arts & Culture",
            "sort_name": "Arts & Culture",
            "id": 1,
            "shortname": "Arts"
        },
        {
            "name": "Book Clubs",
            "sort_name": "Book Clubs",
            "id": 18,
            "shortname": "Book Clubs"
        },
        {
            "name": "Career & Business",
            "sort_name": "Career & Business",
            "id": 2,
            "shortname": "Business"
        }
]
}

import React, { Component } from 'react';
import axios from 'axios';

class Meetups extends Component {

  state = {
    results: []
}
componentDidMount() {
    axios.get('https://api.meetup.com/2/categories?offset=0&format=json&photo-host=public&page=20&order=shortname&desc=false&sig_id=211627025&sig=ae69aec13f23c7837cd55c5a68b99e00719fa225')
        .then(response => {
            let results = response.data.results;
            this.setState({ results: results });
            console.log(response);
        })

}
render() {
    let studentsDisplay = (
        this.state.results.map( (result, index) =>  
        <div  key={index} className="card" style= { {width: '18rem'} }>
            {result.name}
            <br/>
            {result.shortname}
        </div>

    ));
    return (
        <div className='container'>
            {
                studentsDisplay     
            }
        </div>
    );
}
}

export default Meetups;