在fullcalendar timeline视图中将自定义内容添加到标题

我试图在时间线视图中为每天的标题添加额外内容

根据这个链接：

通过连接到resourceRender，它应该是可行的

---

但据我所知，以及我迄今为止所做的尝试，我只能自己掌握资源，而不是每天的标题

我已经创建了一个代码笔，并连接到resourceRender中，以便使用：

---

有什么想法吗？

如果其他人也面临同样的问题，我会通过连接datesRender回调找到解决方案。下面的代码进行了检查，只向resourceTimelineWeek添加了额外的HTML。如果你不需要支票，就把它取下来

请参见此处的代码笔：

datesRender:function（renderInfo）{
让viewType=renderInfo.view.viewSpec.type；
如果（viewType==“resourceTimelineWeek”）{
让dateHeaders=renderInfo.el.querySelectorAll（“th[数据日期]”）；
dateHeaders.forEach（元素=>{
让headerDate=element.dataset.date；
让headerText=element.querySelector（“.fc单元格文本”）；
让extraHTML=“一些文本”
”；
headerText.innerHTML=headerText.innerHTML+外部HTML；
})
}
}

如果其他人也面临同样的问题，我会通过挂接datesRender回调找到解决方案。下面的代码进行了检查，只向resourceTimelineWeek添加了额外的HTML。如果你不需要支票，就把它取下来

请参见此处的代码笔：

datesRender:function（renderInfo）{
让viewType=renderInfo.view.viewSpec.type；
如果（viewType==“resourceTimelineWeek”）{
让dateHeaders=renderInfo.el.querySelectorAll（“th[数据日期]”）；
dateHeaders.forEach（元素=>{
让headerDate=element.dataset.date；
让headerText=element.querySelector（“.fc单元格文本”）；
让extraHTML=“一些文本”
”；
headerText.innerHTML=headerText.innerHTML+外部HTML；
})
}
}

“我只能自己获取资源，而不能每天获取标题。”…是的，确实如此。标题与单个资源无关。在时间轴视图中，标题在技术上是时间段，而不是列标题。通过，您对插槽标签中显示的内容的控制有限。如果您知道哪些时间是可见的，您还可以使用选择器直接访问-每个标题的HTML看起来像

（它与github问题链接中的代码笔不同的原因是，它使用的是timegrid视图，而不是timeline，因此资源的标题位于顶部。在timeline视图中，资源标题位于侧面。）谢谢。我通过查看如何按照您的建议访问每个标题的HTML并发布解决方案来实现这一点。“我每天只能自己获取资源，而不能获取标题。"…是的，这是真的。标题与单个资源无关。在时间轴视图中，标题在技术上是时隙，而不是列标题。通过，您对插槽标签中显示的内容的控制有限。如果您知道哪些时间将可见，您还可以使用选择器直接访问-每个标题的HTML看起来有些稀薄g类似于

（它与github问题链接中的codepen不同的原因是它使用的是时间网格视图，而不是时间线，因此资源的标题位于顶部。在时间线视图中，资源标题位于侧面。）谢谢。我通过查看如何按照您的建议访问每个标题的HTML，并发布了一个解决方案，实现了这一点。

resourceRender: function(renderInfo){
  console.log(renderInfo.el);
},

datesRender: function(renderInfo) {
      let viewType = renderInfo.view.viewSpec.type;
      if (viewType == "resourceTimelineWeek") {
        let dateHeaders = renderInfo.el.querySelectorAll("th[data-date]");
        dateHeaders.forEach(element => {
          let headerDate = element.dataset.date;
          let headerText = element.querySelector(".fc-cell-text");
          let extraHTML = "<p>some text</p>";
          headerText.innerHTML = headerText.innerHTML + extraHTML;
        })
      }
    }