Question

我正在使用react-big-calendar。事件数据具有以纪元格式开始/结束的日期。它无法正确呈现。如何设置访问器属性以使用此JSON格式？

actionItems = 
    [
        {
        "id": 3312,
        "name": "Event Name",
        "startDate": 1518415200000,
        "endDate": 1519797600000,
        "duration": "4 weeks",
        },
]

我当前的日历组件声明

    <BigCalendar
events={actionItems}
views={allViews}
showMultiDayTimes
defaultDate={new Date()}
/>

Answer 1

您可以使用地图功能以正确格式获取事件

const mapToRBCFormat = e => Object.assign({}, e, {
    start: new Date(e.startDate),
    end: new Date(e.endDate))
})

<BigCalendar
    events={actionItems.map(mapToRBCFormat)}
    views={allViews}
    showMultiDayTimes
    defaultDate={new Date()}
/>

Answer 2

Epoch时间只是一个数字，反应大日历接受javascript数据对象。因此，您需要使用以下代码将其转换为javascript日期对象。您可以映射函数并使用该对象来呈现它，并且需要乘以1000以获取时间格式。进一步访问https://www.epochconverter.com/programming/#javascript

// availableSlots是您的对象。

      var freeSlots = availableSlots.map(obj => {

        var slotObj = {};
        delete   obj.duration;

        slotObj['start'] = new Date(obj.start * 1000);
        slotObj['end'] = new Date(obj.end * 1000);
        slotObj['title'] = "Book"; // extra field
        return slotObj;
    });

希望它能起作用：）

反应BigCalendar日期转换

2 个答案:

反应Big​​Calendar日期转换

2 个答案:

反应BigCalendar日期转换