通过API调用在React FullCalendar中传递数据

问题描述 投票:1回答:1

我正在通过API调用获取一些数据,数据看起来像这样

{
    "events": [
        {
            "id": 7, 
            "comments": "", 
            "origin": "Terrassa, Spain", 
            "destination": "Delft, Netherlands",
            "total_trucks": 0,
            "material_type": "0", 
            "scheduled_date": "2019-09-29T01:01:00", 
            "offered_price": 0, 
            "weight": 7979879, 
            "status": "Assigned",
            "posted_on": "2019-09-23T15:24:39.946644",
            "All_India": true,
            "Andhra_Pradesh": false,
            "Assam": false,
            "Bihar": false,
            ...
            "West_Bengal": false,
            "owner": 1,
            "truck_type": 2,
            "truck_name": 139
        }
    ]

}

根据此数据,我希望我的reactFullCalender事件的'date'字段中的schedule_date和那些事件的标题中的total_weight和total_trucks。到目前为止,我在日历屏幕上的事件中一直尝试将其输出为Object object。我的代码是:

<FullCalendar defaultView="dayGridMonth" plugins={[ dayGridPlugin ]}
events={[{ title: this.state.calendarEvents, date: '2019-09-22'] />

而且我的API调用看起来像这样:

 const calendarEvent = await getEventsData();
        this.setState({calendarEvents:calendarEvent});

        console.log(calendarEvent,
            "calendarEvents");

我的状态看起来像这样:

this.state = {
            calendarEvents:[
                {totalTrucks:''},
                {totalWeight:''}]};}

[我想要的是API调用calendarEvent获取数据,我想将其提供给fullCalender中的事件

javascript reactjs fullcalendar fullcalendar-4
1个回答
0
投票

您能使用这个吗:

setStateAsync(state) {
    return new Promise((resolve) => {
      this.setState(state, resolve)
    });

从数据获取状态后异步设置状态。

This has a reference where we set State asynchronously.

© www.soinside.com 2019 - 2024. All rights reserved.