如何在React.js中循环和映射JSX中的API值？

Question

如何在React.js中循环和映射JSX中的API值？为了映射我要导入的东西是什么？ 我的代码：

eventlistClick (){
     var apiBaseUrl = "http://api.eventsacross-stage.railsfactory.com/api/";
     var input = this.state.search_event;
     axios.get(apiBaseUrl+'v1/events/?on_dashboard=false'+input)
     .then(function (response) {
        console.log(response);
        for(var i = 0; i < response.data.events_count; i++) {
          var obj = response.data.events[i];
          console.log(obj.name);
        }
      })
      .catch(function (error) {
        console.log(error);
      });
  }

我想打印＆＃34; obj.name＆＃34;之后＆＃34;活动名称＆＃34;

render(){
   return (...
       <div className="col-sm-5">
          <button
            className="btn btn-default"
            type='submit'
            onClick={this.eventlistClick.bind(this)}>
            <i className="glyphicon glyphicon-search"></i>
          </button>
            <h1 className="text-center">Events List</h1>
            <div className="panel panel-default">
              <div className="panel-heading">Event Name</div>
              <div className="panel-body">
                <p>Description</p>
                <p>URL</p>
                <p>City</p>
                <p>Date [Start At - End At]</p>
              </div>
            </div>
          </div>
);
}