使功能特定于 Meteor 模板并可由其事件处理程序访问

Question

有没有一种方法可以创建特定于模板并可由模板的事件处理程序访问的函数？我不想污染全局命名空间。

当我第一次注意到我以类似于此的方式在我的事件处理程序之间重复大量代码时，我遇到了这个问题：

Template.options.events({
    "click .btn-1": function(e) {
        // do something
        var div;
        div = $(e.target);
        if (div.hasClass("active")) {
          return div.removeClass("active");
        } else {
          return div.addClass("active");
        }
      },
    "click .btn-2": function(e) {
        // do something else
        var div;
        div = $(e.target);
        if (div.hasClass("active")) {
          return div.removeClass("active");
        } else {
          return div.addClass("active");
        }
    }
});

请注意，我并不是想找到一种组合选择器的方法，我已经知道该怎么做。请注意，每个按钮都有不同的作用，但有几行重复的代码。我想在不污染全局命名空间的情况下尽可能保持干燥。

Answer 1

Meteor 项目中的每个文件都有自己的本地范围。如果您使用 function blah() { ... } 或 var blah = function () { ... } 在一个文件中定义函数，则在该文件之外将无法访问该函数。只有 blah = function () { ... }（没有 var）定义了真正的全局。

如果这还不够，您可以在立即调用的函数表达式 (IIFE) 中定义局部函数：

(function () {
    function toggleActive(div) {
        if (div.hasClass("active")) {
            div.removeClass("active");
        } else {
            div.addClass("active");
        }
    }

    Template.options.events({
        "click .btn-1": function (e) {
            // do something
            toggleActive($(e.target));
        },
        "click .btn-2": function (e) {
            // do something else
            toggleActive($(e.target));
        }
    });
})();

// toggleActive is inaccessible here

使功能特定于 Meteor 模板并可由其事件处理程序访问

Making functions specific to Meteor templates and accessible by its event handlers

javascript

meteor

meteor-helper