时间戳

首页 > 解决方案 > Vue 和 Fullcalendar 自定义日单元

vue.js - Vue 和 Fullcalendar 自定义日单元

问题描述

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

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

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

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

标签： vue.jsfullcalendar

解决方案

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

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

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

domNodes: [button.$el],

推荐阅读