javascript Backbone.js 查看实例变量?

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/7630652/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-26 00:45:11  来源:igfitidea点击:

Backbone.js view instance variables?

javascriptjquerybackbone.jsbackbone-views

提问by Ville

I'm learning Backbone.js and am trying to figure out whether it's possible to have instance variables in Backbone views.

我正在学习 Backbone.js 并试图弄清楚是否可以在 Backbone 视图中包含实例变量。

My goal is to load a view's templates from an external file when a view is being instantiated. Currently I'm storing them in a global variable in the Backbone app's global namespace, but it would be cleaner to store the templates in a view's instance variables. Currently I have it set up like this:

我的目标是在实例化视图时从外部文件加载视图模板。目前我将它们存储在 Backbone 应用程序的全局命名空间中的全局变量中,但将模板存储在视图的实例变量中会更清晰。目前我设置如下:

var templates = {};

MessageView = Backbone.View.extend({

    initialize: function() {
        $.get('js/Test2Templates.tpl', function(doc) {

            var tmpls = $(doc).filter('template');

            templates['MessageView'] = [];

            tmpls.each(function() {
                templates.MessageView[this.id] = $.jqotec($.unescapeHTML(this.innerHTML));
            });
        });
    },

    render: function() {
        var tpldata = {name: 'Ville', thing: 'Finland'};
        $('#display').jqoteapp(templates.MessageView.greeting_template, tpldata);
    },

    events: {
        "click input[type=button]": "additionalTransactions"
    },

    additionalTransactions: function() {
        this.render();
    }

});

But instead of using "templates" being defined as a global var, I'd like to create 'templates' in a view's initialize function, along these lines (but this doesn't work):

但是,我不想使用定义为全局变量的“模板”,而是按照以下方式在视图的初始化函数中创建“模板”(但这不起作用):

MessageView = Backbone.View.extend({

    view_templates: {},

    initialize: function() {
        $.get('js/Test2Templates.tpl', function(doc) {

            var tmpls = $(doc).filter('template');

            tmpls.each(function() {
                this.view_templates[this.id] = $.jqotec($.unescapeHTML(this.innerHTML));
            });
        });
    },

    render: function() {
        var tpldata = {name: 'Ville', thing: 'Suomi'};
        $('#display').jqoteapp(this.view_templates.greeting_template, tpldata);
    },

    events: {
        "click input[type=button]": "additionalTransactions"
    },

    additionalTransactions: function() {
        this.render();
    }

});

This is probably (?) pretty straightforward and/or obvious, but me being somewhere on the Backbone.js learning curve, I'd much appreciate any help with this!! Thanks!

这可能 (?) 非常简单和/或显而易见,但我在 Backbone.js 学习曲线上的某个地方,我非常感谢任何帮助!!谢谢!

回答by mu is too short

Your view_templatesinstance variable is fine (and a good idea as well). You just have to be sure that you're using the right thisinside your $.get()callback and inside your tmpls.each()call. I think you want your initializeto look more like this:

您的view_templates实例变量很好(也是一个好主意)。你只需要确保你this在你的$.get()回调和你的tmpls.each()通话中使用了正确的。我想你希望你initialize看起来更像这样:

initialize: function() {
    this.view_templates = { };

    var _this = this;
    $.get('js/Test2Templates.tpl', function(doc) {
        var tmpls = $(doc).filter('template');
        tmpls.each(function() {
            _this.view_templates[this.id] = $.jqotec($.unescapeHTML(this.innerHTML));
        });
    });
},

I'm not sure which this.idyou want inside the tmpls.each()but I'm guessing that you want the DOM idattribute from the current template so I left it as this.id.

我不确定this.id您想要哪个,tmpls.each()但我猜想您想要id当前模板中的 DOM属性,所以我将其保留为this.id.

The this.view_templatesassignment in your constructor (initialize) is needed because you presumably want each instance of the view to have its own copy of the array. Creating a new view instance doesn't do a deep copy of the the view so if you just have:

this.view_templates构造函数 ( initialize) 中的赋值是必需的,因为您可能希望视图的每个实例都有自己的数组副本。创建新的视图实例不会对视图进行深层复制,因此如果您只有:

MessageView = Backbone.View.extend({
    view_templates: {},
    // ...

then all the instances will end up sharing the same view_templatesobject and view_templateswill behave more like a class variable than an instance variable.

那么所有的实例最终将共享同一个view_templates对象,并且view_templates表现得更像一个类变量而不是一个实例变量。

You can specify your instance variables in the view definition (i.e. the Backbone.View.extend()call) as a form of documentation but you will want to initialize any of them that should behave as an instance variable in your initializemethod; read-only or "class variables" like eventscan be left as part of the view's definition.

您可以在视图定义(即Backbone.View.extend()调用)中将实例变量指定为文档形式,但您需要初始化它们中的任何一个,这些变量应该在您的initialize方法中表现为实例变量;只读或“类变量”之类的events可以作为视图定义的一部分。