Backbone.js 查看实例变量?

2024-03-08

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

我的目标是在实例化视图时从外部文件加载视图的模板。目前,我将它们存储在 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();
    }

});

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

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();
    }

});

这可能(?)非常简单和/或明显,但我正处于 Backbone.js 学习曲线上的某个位置,我非常感谢任何帮助!谢谢!


Your 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));
        });
    });
},

我不确定是哪一个this.id你想要在里面tmpls.each()但我猜你想要 DOMid当前模板中的属性,因此我将其保留为this.id.

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

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

那么所有实例最终将共享相同的view_templates对象和view_templates其行为更像是类变量而不是实例变量。

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

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

Backbone.js 查看实例变量? 的相关文章

随机推荐

  • 在 Jetpack Compose 中创建多个视图模型实例

    我们知道下面的创建实例的方式非常好 可以享受生命周期管理 在 ViewModel 中创建的实例是相同的 但如果想在一个页面上创建两个实例 该如何创建呢 fun Following viewModel FollowViewModel view
  • php - 打印数组的偶数和(排序的)奇数

    我有一个下面给出的数组 array array 50 51 52 53 54 55 56 57 58 59 我正在尝试打印数组的值 而偶数将保持相同的顺序 奇数将进行排序 即 59 57 55 53 51 输出应该是这样的 50 59 52
  • 如何强制 cdn.rawgit.com 使用更新的文件

    我正在使用 cdn rawgit com 托管项目的一些脚本和 CSS 但无法刷新它 根据常见问题解答 对 cdn rawgit com 的请求通过 MaxCDN 的超快速内容交付网络进行路由 并在第一次加载时永久缓存 这会带来最佳性能并减
  • 为什么浏览器要为 CSS 属性创建供应商前缀?

    也许这是一个显而易见的答案 但是 Why on earth浏览器是否会决定创建自己的供应商前缀border radius等等 我的意思是 为什么我必须输入 moz border radius 10px webkit border radiu
  • 通过回调方法使用 Quarkus/Mutiny 将 MyRequestService 连接到 Reactive REST GET 端点

    上周我与Mutiny https smallrye io smallrye mutiny 图书馆 因为我需要一个Reactive https en wikipedia org wiki Reactive programming我的 REST
  • 使用paste0时转义斜杠

    我正在尝试将几个字符串连接在一起 包括反斜杠 但是 我似乎无法正确转义反斜杠 paste0 A B 给我Error unexpected symbol in paste0 A B while paste0 A B returns A B 我
  • DOM选择方法的文档顺序

    我知道实时 NodeList 返回getElementsByTagName保留元素的文档顺序 这是真的吗getElementsdByClassName getElementsByName and querySelectorAll方法 这些方
  • JavaScript 中的 window.location 替代方案

    什么是标准化替代品window location href财产 我在 w3schools com 上检查它是否已在所有主要浏览器中实现 因此没有问题 但我很好奇如何正确执行此操作 从这里可以看出该函数没有标准化 https develope
  • 我应该使用什么重定向 uri (OAuth 2.0)?

    我为 google API Console 注册了我的应用程序 我得到了我的客户秘密 客户 ID 以及两个重定向 uri urn xxxxxxx oob http localhostxxxxxx 当然 我使用这些项目并成功向谷歌请求令牌 但
  • MySQL 并发性,它是如何工作的以及我是否需要在我的应用程序中处理它

    我目前正在运行 MySQL 数据库 我的所有表都使用表引擎 InnoDB 每个登录我的应用程序的人都可以查看记录 我担心在某些时候两个用户可能会同时更新或插入记录 MySQL 是否能够优雅地处理这种类型的并发问题 还是我必须将其编程到我的代
  • PCRE 正则表达式反向引用有效,但子例程无效

    我正在尝试匹配文本 1 嘿嘿嘿嘿 2 嘿嘿嘿嘿 与正则表达式 a w 1 w b w w w c w 1 w Regex a火柴1完全 并且2完全 但最后一个 y Regex b完全匹配1 and 2 Regex c不匹配1 or 2 下列
  • WordPress 博客分页不起作用

    我仍然卡在这个问题上 我的 WordPress 博客上的分页无法正常工作 http www example com news http www example com news 当您单击不同的页码时 它会正确更新 URL 和页面标题 但不会
  • Swift Couple - Publishers.CombineLatest 在多个线程上

    当将 Publishers CombineLatest 与运行除 Main 的 sink 以外的线程的 Publishers 一起使用时Publishers CombineLatest并不总是被调用 这个问题并不是每次都会出现 这就是为什么
  • 在 Facebook 见解上找不到我的应用程序?

    我正在使用社交插件运行一个网站 所以我创建了一个 Facebook 应用程序 然后我想使用 facebook inform 来连接我的网站和应用程序 ps 我还在标题中添加了app id或meta 但我在连接列表中找不到我创建的应用程序 有
  • 如何在 Android 中将 getview() 与 SimpleAdapter 一起使用?

    我正在生成一个ListView用一个SimpleAdapter My SimpleAdapter代码如下 ListAdapter k new SimpleAdapter this val1 R layout mytask new Strin
  • QTextEdit 中的水平线

    我试图在一个水平线QTextDocument 我使用 HTML 进行格式化 为了画出我想要的线条 我自然地使用了 hr 标签 但这条线是灰色的 我想把它的颜色改为黑色 这些样式似乎不适用于hr元素 那么有没有一个简单的解决方法可以在我的文档
  • 如何在Python中使用“with open”打开多个文件?

    我想一次更改几个文件 iff我可以写信给他们所有人 我想知道是否可以以某种方式将多个开放调用与with陈述 try with open a w as a and open b w as b do something except IOErr
  • Flask 应用程序“使用 stat 重新启动”

    我已经构建了一些 Flask 应用程序 但在我最新的项目中 我注意到开发模式有些奇怪 终端中常见消息的第二行始终显示 Running on http 127 0 0 1 5000 Restarting with reloader 已被替换为
  • git bisect skip 如何选择下一个提交来尝试?

    使用时git bisect 一个人可以跑git bisect skip将当前提交标记为不可构建 不可测试的提交 尝试让 Git 选择其他提交进行测试 Git 如何决定在某个提交之后尝试哪个提交git bisect skip 实验表明这不仅仅
  • Backbone.js 查看实例变量?

    我正在学习 Backbone js 并试图弄清楚是否可以在 Backbone 视图中包含实例变量 我的目标是在实例化视图时从外部文件加载视图的模板 目前 我将它们存储在 Backbone 应用程序的全局命名空间中的全局变量中 但将模板存储在