Vue.js 将元素UI日期选择器添加到Vue FullCalendar自定义按钮

使用jQuery，我们可以轻松地对viewRender进行DOM操作，以便向现有HTML元素添加额外的DOM/操作

$('#calendar').fullcalendar({
    customButtons: {
        newButton: {
           text: 'New Button', // if possible I want this to have an element ui datepicker component here
           click: function() {
              //I want to show date picker when this button is clicked
           }
        }
    }
})

但是，我想在VuelCalendar中应用这一点，其中显示元素UI日期选择器，我们只能这样做：

<full-calendar :events="events" />

---

谢谢。

vue fullcalendar包只是

jQuery

包的一个包装，因此向它传递一个引用将为您提供

fullcalendar

附加到的底层DOM实例：

<full-calendar :events"events" ref="fullcalendar">

但这不是你真正想要的，是吗？您需要使用绑定而不是操作DOM的

vue

方式

---

不幸的是，您必须为此更改软件包，因为这不是真正的Vue组件，而只是jQuery组件的一个包装。Fullcalendar有其API，我们可以在其中使用，例如：

声明：

    let calendarEl = document.getElementById('fCalendar');
    this.fCalendar = new Calendar(calendarEl, {
         //options
    })
    this.fCalendar.render();

转到今天方法示例：

this.fCalendar.today() // go to today

请注意，我使用的是v4 alpha

this.fCalendar.today() // go to today