javascript - 用 Backbone 交换 View ?

标签 javascript jquery backbone.js

我环顾四周,但还没有找到解决以下问题的好方法:

我有一个 Backbone View 绑定(bind)到页面上的 el,这是一个容器元素,在传统意义上我称之为“侧边栏”(为了便于解释)。 此侧边栏元素的 inner-html 需要根据路线完全更改。但是,页面上的位置永远不会改变,并且会始终填充此容器

现在,对于初始原型(prototype),我在这个容器和放置在其中的 View 之间建立了 1:1 的关系(我只编写了一条路线)。但是现在,如我所提到的,所述 View 需要根据路线进行更改。

由于这些不同的 View 具有完全不同的 html 标记、对事件的响应等...我曾认为拥有一个可以在 subview 中交换的更高级别的 View 是有意义的.当然,一种有效的解决方案是在同一个 View 中处理所有内容,但必要的逻辑会很麻烦(而且非常笨拙)。

目前,这是我的想法(并已部分实现):

  • 拥有此页面元素的顶级 View 。
  • 根据路线,交换必要的 subview 。
    • 这些 subview 是用 dust.js 呈现的,其中页面上这个组件的 .html 模板是通过 AJAX 延迟加载、编译和缓存的。后续渲染仅包括使用新上下文调用缓存的“已编译”函数。
    • 此外,我打算在顶级 View 中初始化和缓存每个 subview View ,这样我只需要实例化、设置事件处理程序等一次。

然后,根据路由,查找关联的 subview View (缓存),并将其交换到当前 View 的位置。

现在,正如我所提到的,我已将其大部分编码并......半工作。然而,我正在努力解决的是如何让这些 subview 中的每一个独立存在并处理交换,但无论组件当前是否显示,都保持所有事件处理程序和当前状态继续存在.

基本上:

  • 如何避免在每次需要时完全销毁/重新实例化 subview 。也许这个手术并不像我想象的那么昂贵,我应该只做后者。
  • 因为顶级 View (“管理器”,如果你愿意的话)绑定(bind)到容器 $el,如何在 subview 中交换。

我确信有一个简单、优雅的解决方案。不幸的是,我还没有找到它。

最佳答案

就第 1 点而言,我认为每次都创建 View 不会太昂贵。

对于第 2 点 - 我建议使用 Backbone.Marionette https://github.com/derickbailey/backbone.marionette .它具有布局的概念,可让您定义应用的不同区域并分别呈现/管理它们。

我推荐 Backbone.Marionette 不仅是因为第 2 点,而且我认为它允许您管理交互的方式比标准 Backbone 好得多。

关于javascript - 用 Backbone 交换 View ?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/11085660/

相关文章:

backbone.js - 检索添加到 Backbone.js 集合的项目的索引位置

javascript - Javascript 中的正则表达式 : replace minus with comma+minus when condition is met

Javascript 字符串未定义

javascript - 具有固定列的可滚动表,固定大小相同

c# - 从 asp.net 中的代码隐藏执行 javascript

JQuery 事件处理程序范围

javascript - 错误 : Uncaught ReferenceError: module is not defined when using module. 导出

javascript - 每次点击都会 react 进度条

javascript - 如何提高 Jasmine-Blanket SpecRunner.html 的性能?

javascript - 模型选项的目的是什么?