0

我想在内部使用变量，我看到其他人这样做，但为什么它对我不起作用？

这是我的 ES6 文件

// Setup module
// ------------------------------

var FullCalendarAdmin = function () {

    //
    // Setup module components
    //
    var _componentRender = function () {

    // Basic calendar
    var _componentFullCalendarAdmin = function (events) {

        // Define element
        var calendarAgendaViewElement = document.querySelector('.fullcalendar-agenda-admin');

        // Initialize
        if (calendarAgendaViewElement) {
            var calendarAgendaViewInit = new FullCalendar.Calendar(calendarAgendaViewElement, {
                plugins: ['dayGrid', 'timeGrid', 'interaction'],
                select: function (start, end) {
                    var title = prompt("Add event:");
                    var data;
                    if (title != '') {
                        data = {
                            title: title,
                            start: start,
                            end: end
                        };
                        calendarAgendaViewInit.addEvent(data);
                    }
            }).render();

        }
    };

    //
    // Return objects assigned to module
    //

    return {
        init: function () {
            _componentRender();
        }
    }
}();


// Initialize module
// ------------------------------

document.addEventListener('DOMContentLoaded', function () {
    FullCalendarAdmin.init();
});

如何使用calendarAgendaViewInit来调用addEvent函数而不将函数作为未定义的错误？

提前致谢！

4

2 回答 2

1

问题是您.render立即调用。
因此，您calendarAgendaViewInit不是该方法的实例，FullCalendar.Calendar而是该render方法的结果。
你可以做的是首先定义calendarAgendaViewInit变量

var calendarAgendaViewInit = new FullCalendar.Calendar(calendarAgendaViewElement, {
                plugins: ['dayGrid', 'timeGrid', 'interaction'],
                select: function (start, end) {
                    var title = prompt("Add event:");
                    var data;
                    if (title != '') {
                        data = {
                            title: title,
                            start: start,
                            end: end
                        };
                        calendarAgendaViewInit.addEvent(data);
                    }
            });

然后调用calendarAgendaViewInit.render().

于 2019-06-11T18:56:28.877 回答
1

这是对上述评论的一种扩展解释。它看起来calendarAgendaViewElement只是您找到并分配给变量的 DOM 元素。这里的问题是您只能在类实例上调用方法，这些实例现在是内部带有方法的对象。如果您看到其他人addEvent这样调用，那么他们很可能在类的实例化上调用它，该类含义addEvent先前已声明为该类的一部分，而他们只是在调用该方法。

看下面的例子，

如果我声明一个类如下：


class Sample {
   sayHello(){
      console.log('hello')
    }
 }

然后实例化 'Sample' 类的新对象：

var sampleClass = new Sample()

然后我可以通过引用对象内部的方法来调用“sayHello”

sampleClass.sayHello() // hello

希望有帮助

于 2019-06-11T19:05:32.690 回答