如何显示API结果

如何在React中显示以下API结果

我用来从url获取api数据的代码

constructor(props) {
        super(props);
        this.state = { results: [] };
    }

    componentDidMount() {
           fetch('url', {
            method: 'GET',
            headers: {
                'api-key': 'api-key'  
            }
        })
            .then(results => results.json())
            .then(data => this.setState({ results: data }));
    }

但这给了我这行的错误信息

TypeError:results.map不是function.renderemployeeTable函数

---

我尝试替换此行

this.state={results:[]}并能够使用
{results.data.Table[0]。first_name}{results.Table[0]。last_name}
显示，您需要将其存储在状态或作为道具发送并显示

<div>{data.Table[0].first_name}</div>

{data.Table[0]。名字}
构造器（道具）{
超级（道具）；
此.state={
jsonData:'}}
fetchJsonData=（）=>{
返回获取（'http://172.16.0.140:3005/api/v3/users/faq')
.then（response=>response.json（））
.然后（jsonData=>{
返回jsonData；
})
.catch（错误=>console.log（错误））
}
componentDidMount（）{
fetchJsonData（）。然后（数据=>{
这是我的国家({
jsonData：数据，
});
});
}
render（）{
返回(
this.state.jsonData.map（（数据，i）=>{
返回(
{data.Table[0].id}，{data.Table[0].first_name}，{data.Table[0].last_name}
)}))}
构造器（道具）{
超级（道具）；
this.state={jsonData:[]}；
}
fetchJsonData=（）=>{
返回取回（“http://dummy.restapiexample.com/api/v1/employees")
.then（response=>response.json（））
。然后（数据=>{
返回数据；
})
.catch（错误=>console.log（错误））；
};
componentDidMount（）{
this.fetchJsonData（）.then（数据=>{
控制台日志（数据）；
这是我的国家({
jsonData：数据
});
});
}
render（）{
返回this.state.jsonData.map（（数据，i）=>{
返回(
{data.employee_name}，{data.id}
);
});
}
}
构造器（道具）{
超级（道具）；
this.state={results:[]}；
}
componentDidMount（）{
取回（“http://dummy.restapiexample.com/api/v1/employees", {})
.then（results=>results.json（））
.then（data=>this.setState（{results:data}））；
}
renderemployeeTable=结果=>{
返回(
{results.map（results=>(
{results.id}
{results.employee_name}
))}
);
};
render（）{
返回(
-
{this.renderemployeeTable（this.state.results）}
);
}
}
谢谢，我有这样的属性
constructor（props）{super（props）；
this.state={results:[]}；}`和return
static renderemployeeTable（results）{return（{results.map（results=>
这是我尝试过的，但它给了我codepile.net/pile/gE3kx1Eoyes，我正在写入data.employee\u您写入的一维数组的名称data.data.Table[0].Employee_Number或data.data.Table.Employee_Number事实上我忘了你的json数据Orry silva我只是在localhost中用一维数据进行了尝试它对我不起作用。我用postman的数据进行了尝试。[{“Employee_Number”：10003，“first_name”：“kuku”，“last_name”：“gebre”}]

i get

TypeError:无法读取此行中未定义的

error的属性“map”

>36 |返回this.state.jsonData.map（（data，i）=>{

Post您的json数据，我不知道您的json数据基于此我们将编写logicArey，昨天我发布了使用您的api和呈现函数render写入该逻辑的逻辑{data.data.Table[0].first_name}如果它不起作用，它将起作用呈现此{data.data.Table.first_name}肯定有一个会起作用，这意味着我的代码中的某个地方有问题。您看到我的代码堆了吗？注释不用于扩展讨论；此对话已结束。

   constructor(props) {
    super(props);
    this.state = {
 jsonData:''}}
  fetchJsonData = () => {
      return fetch('http://172.16.0.140:3005/api/v3/users/faq')
        .then(response => response.json())
        .then(jsonData => {
          return jsonData;
        })
        .catch(error => console.log(error))
    }
     componentDidMount() {
        fetchJsonData().then(data => {
          this.setState({
            jsonData: data,
          });
        });
      }

     render() {
        return (
          this.state.jsonData.map((data, i) => {
            return (
    <div>{data.Table[0].id},{data.Table[0].first_name},{data.Table[0].last_name}
    </div>
    )}))}

 constructor(props) {
    super(props);
    this.state = { jsonData: [] };
  }

  fetchJsonData = () => {
    return fetch("http://dummy.restapiexample.com/api/v1/employees")
      .then(response => response.json())
      .then(data => {
        return data;
      })
      .catch(error => console.log(error));
  };

  componentDidMount() {
    this.fetchJsonData().then(data => {
      console.log(data);
      this.setState({
        jsonData: data
      });
    });
  }
  render() {
    return this.state.jsonData.map((data, i) => {
      return (
        <div>
          {data.employee_name},{data.id}
        </div>
      );
    });
  }
}

constructor(props) {
    super(props);
    this.state = { results: [] };
  }

  componentDidMount() {
    fetch("http://dummy.restapiexample.com/api/v1/employees", {})
      .then(results => results.json())
      .then(data => this.setState({ results: data }));
  }
  renderemployeeTable = results => {
    return (
      <div class="container-fluid" class="row" fluid={true}>
        {results.map(results => (
          <div class="col-sm-3">
            <div class="card our-team">
              <div class="card-body">
                <p class="card-text">{results.id}</p>
                <p class="card-text">{results.employee_name}</p>
              </div>
            </div>
            <a href="#" class="btn btn-primary">
              Detail
            </a>
          </div>
        ))}
      </div>
    );
  };
  render() {
    return (
      <div>
        <h1 id="tabelLabel">-</h1>
        {this.renderemployeeTable(this.state.results)}
      </div>
    );
  }
}