完整日历 - 如何将前导零添加到完整日历的月视图中的日期

Question

我想在FullCalendar月视图中将这些单位数天添加前导零。

我想要的是：

意味着，3为03,4为04等等。

Answer 1

在fullCalendar选项中似乎没有这样的选项。如果不修改fullCalendar源代码，我能想到的最好的就是这个。如果您查看呈现的日历HTML，您会看到每天的数字都包含在<td>的CSS类fc-day-number中。所以我们可以修改<td>的内容。将此代码直接放在日历初始化代码之后：

$('.fc-day-number').each(function() {
  var day = $(this).html(); //get the contents of the td
  //for any fields where the content is one character long, add a leading zero
  if (day.length == 1)
  {
    $(this).html("0" + day);
  }
});     

Answer 2

几年后，我找不到将天数格式设置为前导零的选项，我以相同的方式进行了操作，但是Fullcalendar 5.4.0中没有JavaScript：

在我的情况下，类名是Empire Earth，我认为该类实现了初始化视图的类型，在我的情况下，其用以下内容初始化：.fc-daygrid-day-number

{initialView: 'dayGridMonth'}

Answer 3

我在 React 上遇到了同样的问题，并发现这个问题是等价的。然后我在 Fullcalendar 5.6.0 提出了这个解决方案：

我使用了一个名为“dayCellContent”的道具并传递了一个函数来返回格式化的字符串。

<FullCalendar
  plugins={[dayGridPlugin]}
  initialView="dayGridMonth"
  dayCellContent={({ dayNumberText }) => (("00" + dayNumberText).substring(dayNumberText.length))}
/>