Vue 和 Fullcalendar 自定义日单元

【问题标题】：Vue and Fullcalendar customizing day cellVue 和 Fullcalendar 自定义日单元
【发布时间】：2021-04-15 15:15:40
【问题描述】：

我需要在每天的单元格中添加一个按钮。我知道我可以做类似的事情：

dayCellContent: {
  html: `<button> button text </button>`,
},

但我并不想这样做，我更愿意使用我的按钮组件。同样像这样，我必须在没有 Vue 的情况下添加点击侦听器，我也不太喜欢。

那么有没有更好的方法来做到这一点？最好只传入Vue组件？

【问题讨论】：

标签： vue.js fullcalendar

【解决方案1】：

我通过使用一个组件并像这样使用 Vue 构造函数对其进行初始化来解决这个问题。

const el = document.createElement("a");
 const calendarDayCellContentContainer = new Vue({
        el,
        render: (h) =>
          h(CalendarDayCellContent, {
            props: {
              buttonText: "whatever",
            },
          }),
      });

并将 button.$el 作为 DOM 节点传递。

domNodes: [button.$el],

【讨论】：