在主干牵线木偶中有一种方法可以判断一个区域是否已经显示了一个视图?

时间:2013-08-13 11:43:29

标签: backbone.js marionette

考虑到这样的事情:

View = Backbone.Marionette.ItemView.extend({ });

myView = new View();

//region already exists
myLayout.region.show(myView)

//some time later this gets called again:
myLayout.region.show(myView)

我可以在文档中看到currentView,但这似乎只适用于初始化。显示视图后,我可以查询区域以查看视图吗?视图实例或类型都会有所帮助。查看Chrome的调试器,我看不到该区域的任何有用的属性/方法。

想要这样做的动机是,如果已经显示,则我不再显示区域中的静态项目视图,因为这可以(特别是如果涉及图像)会在屏幕上产生轻微的闪烁效果。 / p>

由于

- Justin Wyllie

3 个答案:

答案 0 :(得分:11)

您可以在调用show method之前添加条件:

if (myLayout.region.currentView != myView)
    myLayout.region.show(myView)

因此,如果您尝试使用相同的show来致电View,则不会显示。

如果您想以这种方式结账,请致电region.show(myView)

if (_.isUndefined(myLayout.region.currentView))
    myLayout.region.show(myView)

答案 1 :(得分:7)

您可以查看视图的isClosed$el属性。像

这样的东西
if (myView.isClosed || _.isUndefined(myView.$el)) {
  myLayout.region.show(myView);
}

这与区域检查视图是否关闭的方式相同:

show: function(view) {

  this.ensureEl();

  var isViewClosed = view.isClosed || _.isUndefined(view.$el);
  ...

答案 2 :(得分:0)

我在这里走出困境并假设OP的问题是基于导航到应用程序的不同部分时通过导航中的锚标记或类似的东西来应用行为。

这就是我发现这个问题的方法,我简单地想到答案会节省我的一天。虽然到目前为止这两个答案都是正确的,但它们并没有完全解决我遇到的问题。我想显示一个持久的导航栏。但是,我不希望它显示在登录页面上。我希望检测一个区域是否已经显示,我能够正确地让显示逻辑处理这个问题。

事实证明我们都在实现区域的正确轨道,因为这提供了精细控制,但即使在实施上述之后,我发现我的导航栏仍然会闪烁"并且基本上完全重新加载。

答案实际上有点荒谬。在所有的Backbone教程和研究中,我过去两周一直在做,我从未想过要实现一个javascript接口来中断正常的链接行为。每当点击导航项时,整个应用程序都在重新加载。路由功能正常,因此内容正确,但闪烁令人抓狂。

我在Backbone.history.start({pushState:true})之后立即将以下内容添加到我的app.js文件中;代码:

// Holy crap this is SOOO important!
$(document).on("click", "a[href^='/']", function(event) {
  if (!event.altKey && !event.ctrlKey && !event.metaKey && !event.shiftKey) {
    event.preventDefault();
    var url = $(event.currentTarget).attr("href").replace(/^\//, "");
    Backbone.history.navigate(url, { trigger: true });
  }
});

查看这篇文章,了解有关keyPress检测内容的一些解释。 http://dev.tenfarms.com/posts/proper-link-handling

轰!在我的应用程序中添加此内容后,不再完全重新加载!

免责声明:我对Backbone非常陌生,而且上面对我来说这样的启示让我觉得我可能在其他地方做错了,这种行为应该已经存在于Backbone中。如果我在这里发生了一个巨大的错误,请发表评论并帮我纠正。