用于存储/检索与 dom 元素关联的 Backbone.js 视图实例的模式答案

【问题标题】：patterns for storing/retrieving Backbone.js View instances associated with dom elements用于存储/检索与 dom 元素关联的 Backbone.js 视图实例的模式
【发布时间】：2014-10-31 13:25:34
【问题描述】：

当我们在 Backbone.js 中创建视图实例时，我们分配了一个根 dom 元素，该元素在视图内部成为 this.el。在我们的 Backbone.js 应用程序中，我们可能有对视图实例的引用，因此使用视图很容易。但是，假设页面上有另一个脚本没有对视图实例的引用，但知道哪个 dom 元素代表视图 (this.el)。 Backbone.js 中是否有内置方法可以从 dom 元素中检索视图实例，以便没有对视图实例的引用的代码可以访问该实例？我想做这样的事情：

var viewInstance = $("#rootElId").data("bb-myview");

我不知道backbone.js中有这样的内置功能，但我想我会问一下，以防万一确实存在。

其次，如果这不是 Backbone.js 内置的，那么实现我自己的功能的好方法是什么？有没有我可以复制的好模式？

谢谢！

【问题讨论】：

看看这个：stackoverflow.com/questions/5013848/…

标签： javascript jquery backbone.js

【解决方案1】：

我们使用木偶布局和区域来完成此类功能

创建布局的方式

var AppLayoutView = Backbone.Marionette.LayoutView.extend({
  template: "#layout-view-template",

  regions: {
    menu: "#menu",
    content: "#content"
  }
});

var layoutView = new AppLayoutView();
layoutView.render();

在区域中显示视图

layoutView.menu.show(new MenuView());

从区域获取视图

var viewInstance = layoutView.menu.currentView // here you can get the actual view instance

https://github.com/marionettejs/backbone.marionette/blob/master/docs/marionette.layoutview.md

https://github.com/marionettejs/backbone.marionette/blob/master/docs/marionette.region.md

谢谢

【讨论】：

这究竟是如何解决问题的？您仍然无法访问视图视图 DOM 元素，对吧？
@Dethariel 您只需通过 viewInstance 的 .el 元素询问即可访问当前视图实例的 DOM 元素，使用区域将给您带来很多这样的好处或不必担心僵尸意见。
在此解决方案中，您必须存储对视图的引用（在您的示例中为layoutView）。问题是：“如何在不存储视图的情况下访问视图”
确实如此，你可以决定它是否适合你的需要。它不是关于不同的脚本，一切都是关于上下文，正如你在示例中看到的那样，区域代表 DOM 元素，所以如果你知道你知道区域的元素，你使用区域来访问当前显示在它上面的视图实例，就是这样。如果您无法访问当前上下文下的应用程序/布局/区域上下文，则无法获取或操作视图的主干实例，显然您可以使用 jquery 访问 DOM 元素，但这是一个不同的事情。谢谢，甚至 4 你的评论
@Dethariel 问题是我可以复制好的模式吗？