时间戳

首页 > 解决方案 > 如何在FullCalendar的反应js中附加和显示具有其他属性的标题？

reactjs - 如何在FullCalendar的反应js中附加和显示具有其他属性的标题？

问题描述

我想将标题与同一事件的名字和姓氏连接起来，因此事件标题显示为“夜班：Rehan Bhai”

以下是我的活动：

{
        "_id": "5f607e0cc8ec5321c84f8a2d",
        "userId": {
            "_id": "5f5c8a7fcb2f483bf0f45062",
            "username": "Rehan Bhai",
            "firstName": "Rehan",
            "lastName": "Bhai",
            "email": "rehanuser@gmail.com",
            "partener": "yes",
            "type": "user",
            "pass": "$2a$10$zVT1vnJE6nhPq36hk1OJPuwBAxiqenP0sOt5LowdLFPNfqhUy2ZDi",
            "avatar": "//www.gravatar.com/avatar/8092a3d2de82f15929882914c7ad7781?s=200&r=pg&d=mm",
            "regDate": "2020-09-12",
            "__v": 0
        },
        "start": "2020-09-08",
        "end": "2020-09-08",
        "title": "Evening Shift",
        "color": "#25d818",
        "__v": 0
}

以下是我的代码：

<FullCalendar
    defaultView="dayGridMonth"
    plugins={[dayGridPlugin, interactionPlugin]}
  events={events}
  />

标签： reactjsfullcalendartitle

解决方案

尝试像这样解构它

<FullCalendar
  defaultView="dayGridMonth"
  plugins={[dayGridPlugin, interactionPlugin]}
  events={events.map((event) => {
    return {
      id: event._id,
      userId: event.userId,
      start: event.start,
      end: event.end,
      title: `${event.title}: ${event.userId.firstName} ${event.userId.lastName}`,
    };
  })}
/>;

推荐阅读