javascript - 如何在 JavaScript 助手中只声明一次变量？

Question

我正在使用 Meteor-blaze 开发 Web 组件。

在模板助手中，

Template.Button.helpers({
btnName: function() {
    var FirstBtn = new ButtonComponents('Name', this.class, '50px', '30px', '#DDDDDD');
    return FirstBtn.buttonName();
},
btnClass: function() {
    var FirstBtn = new ButtonComponents('Name', this.class, '50px', '30px', '#DDDDDD');
    return FirstBtn.buttonClass();
},
btnStyle: function() {
    var FirstBtn = new ButtonComponents('Name', this.class, '50px', '30px', '#DDDDDD');
    return FirstBtn.buttonStyle();
}});

我只想在助手中声明一次 FirstBtn 。

由于 this.class，我不想在助手之外声明 FirstBtn。

我该怎么做？

Answer 1

var FirstBtn;
function getFirstBtn(cls) {
    if (FirstBtn == null) {
        FirstBtn = new ButtonComponents('Name', cls, '50px', '30px', '#DDDDDD');
    }
    return FirstBtn;
}

Template.Button.helpers({
    btnName: function() {
        return getFirstBtn(this.class).buttonName();
    },
    btnClass: function() {
        return getFirstBtn(this.class).buttonClass();
    },
    btnStyle: function() {
        return getFirstBtn(this.class).buttonStyle();
    }
});

已添加:我强烈建议您在 onCreated 中创建此按钮并将其存储在模板实例本身中。您稍后可以从帮助程序中引用它，如下所示:例如 Template.instance().FirstBtn.buttonName()。