fullcalendar js 当长事件添加标题时每周都会出现。这是让标题出现一次的方法吗？

Question

fullcalendar js 当长事件添加标题时每周都会出现。这是让标题出现一次的方法吗？我在 v5 和 v6 上尝试代码，标题每周都会出现。

<!DOCTYPE html>
<html lang='en'>
<!-- https://fullcalendar.io/docs/initialize-globals-->
<head>
<meta charset='utf-8' />
<script src='https://cdn.jsdelivr.net/npm/@fullcalendar/[email protected]/index.global.min.js'> 
</script>
<script src='https://cdn.jsdelivr.net/npm/@fullcalendar/[email protected]/index.global.min.js'></script>
<script>

  document.addEventListener('DOMContentLoaded', function() {
    var calendarEl = document.getElementById('calendar');
    var calendar = new FullCalendar.Calendar(calendarEl, {
      initialView: 'dayGridMonth',
      events: [
            {
                title: 'Testing 1 the quick brown fox jumps over the lazy dog.',
                start: '2024-01-02',
                end: '2024-02-03',
                color: 'green'
            }
        ],
    });
    calendar.render();
  });

</script>
</head>
<body>
   <div id='calendar'></div>
</body>
</html>

这是在浏览器上渲染页面时的样子

Answer 1

我从未使用过这个库，我不太了解，但我发现有一个名为 eventContent 的事件，每添加一行就运行一次。而且他总是使用同一个物体。因此，我创建了一个列表以避免重复，并且第一次识别新对象时，它会创建一个仅包含标题的第一个字母的跨度（只是为了创建跨度的大小）。这解决了您示例中的问题，但是在真实环境中用更多信息对其进行了很好的测试，我强调这一定是最糟糕的方法哈哈。

内容注入 - 文档 |完整日历

document.addEventListener('DOMContentLoaded', function() {
  var calendarEl = document.getElementById('calendar');
  var noRepeat = [];
  var calendar = new FullCalendar.Calendar(calendarEl, {
    initialView: 'dayGridMonth',
    events: [
          {
              title: 'Testing 1 the quick brown fox jumps over the lazy dog.',
              start: '2024-01-02',
              end: '2024-02-03',
              color: 'green'
          }
      ],
      eventContent: function (arg) {
          var obj = arg.event._def

          if (!noRepeat.includes(obj)) {
          noRepeat.push(obj)
              return true
          }

          // create empty span (but with height > 0)
          var span = document.createElement("span")
          span.textContent = obj.title[0] || "W"
          span.style.opacity = 0
          span.style.userSelect = "none"

          var arrayOfDomNodes = [span]
          return { domNodes: arrayOfDomNodes }
      },
  });
  calendar.render();
});

<script src="https://cdn.jsdelivr.net/npm/@fullcalendar/[email protected]/index.global.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/@fullcalendar/[email protected]/index.global.min.js"></script>
<div id='calendar'></div>

fullcalendar js 当长事件添加标题时每周都会出现。这是让标题出现一次的方法吗？

问题描述投票：0回答：1

1个回答

最新问题

fullcalendar js 当长事件添加标题时每周都会出现。这是让标题出现一次的方法吗？

问题描述 投票：0回答：1

1个回答

最新问题

问题描述投票：0回答：1