将自定义列添加到完整日历列表视图

Question

我正在使用Fullcalendar V4，我正在尝试使用EventRender函数在Listview上的标题之后添加一个新列。

我尝试使用JQuery使用一些代码：

eventRender: function(info) {
info.el.querySelector('.fc-list-item-title').append( "<td>Hello</td>" );
}

这不会产生任何东西。

一些想法？

Answer 1

首先，从以下问题中演示您的代码：https://codepen.io/ADyson82/pen/PoYzEgM - 它确实产生了一些东西，尽管可能不是您想要的。我不相信你的说法"这不会产生任何东西"是正确的。

但无论如何，您 a( 尝试附加文本而不是 HTML，以及 b( 尝试将其附加到另一个单元格中，而不是实际添加新单元格。

由于在 listView 中事件元素el是表格行，因此我们可以在该行中插入一个新单元格。这将正确完成工作：

eventRender: function(info) {
var newCell = info.el.insertCell(3);
var newText = document.createTextNode('Hello');
newCell.appendChild(newText);
}

工作演示：https://codepen.io/ADyson82/pen/BaBzJXy

注：注：您可能还需要考虑向表头添加新单元格，以改善视觉效果。