Node.js 如何在react with axios中映射新帖子？

大家好，我正在创建一个用于创建事件的网站，我正在将我的后端节点代码连接到前端代码。错误为TypeError:this.state.events.map不是函数 事件。渲染

  189 | />
  190 | 
  191 | {/* body of the page */}
> 192 | <div className="card-deck" style={{ marginTop: 60 }}>
      | ^  193 |   {this.state.events.map(event => (
  194 |     <div className="col-4">
  195 |       <div

这是从后端获取事件的eventService文件

const apiEndPoint = 'http://localhost:3100/api/events';

export function getEvents(){
    return http.get(apiEndPoint);
}

export function deleteEvent(eventId){
    return http.delete(apiEndPoint + '/' + eventId)
}

这是州政府

          {this.state.events.map(event => (
            <div className="col-4">
              <div
                class="card mb-5 shadow"
                style={{
                  borderRadius: 20,
                  maxWidth: 300,
                  minWidth: 250,
                  minHeight: 450,
                  maxHeight: 450
                }}
              ><div className="card-deck" style={{ marginTop: 60 }}>
          {this.state.events.map(event => (
            <div className="col-4">
              <div
                class="card mb-5 shadow"
                style={{
                  borderRadius: 20,
                  maxWidth: 300,
                  minWidth: 250,
                  minHeight: 450,
                  maxHeight: 450
                }}
              >

    events: getEvents(),
    user: getUser(),
    users: getUsers(),
    showDetails: false,
    shownEventID: 0,
    showUserProfile: false,
    shownUserID: 0,
    searchQuery: ""
  };```

---

在调用

componentDidMount

之前，React调用

render（）

方法，当发生这种情况时，

this.state.events

不是数组，使

.map

不是函数

要解决这个问题：

在构造函数中，将

事件设置为空数组

{
   events: []
   //Rest of the state...
}

然后当组件第一次呈现时（在调用
componentDidMount
之前），
this.state.events
将是一个空数组，这意味着
.map（）
将是一个函数，它不会抛出该错误。调用
componentDidMount
后，进行API调用并填充您的状态，这将导致重新呈现，并填充UI

额外注意：您不应该在构造函数中进行API调用，这就是
componentDidMount
的用途。
在调用
componentDidMount
之前，React调用
render（）
方法，当发生这种情况时，您的
this.state.events
不是数组，使
.map
不是函数

要解决这个问题：

在构造函数中，将
事件设置为空数组

{
   events: []
   //Rest of the state...
}

然后当组件第一次呈现时（在调用
componentDidMount
之前），
this.state.events
将是一个空数组，这意味着
.map（）
将是一个函数，它不会抛出该错误。调用
componentDidMount
后，进行API调用并填充您的状态，这将导致重新呈现，并填充UI

额外注意：您不应该在构造函数中进行API调用，这正是
componentDidMount
的用途。
首次呈现组件时，请检查state.events是否为数组，因为
map
只能与数组一起使用
 首次渲染组件时，请检查state.events是否为数组，因为
map
只能与数组一起使用