Question

我有一个Marionette.CompositeView，它会在点击时显示模态对话框。

events: {
  'click #my-new-view' : 'viewMyNewView'
}
...
viewMyNewView: function() {
  var newView = new MyNewView();
  App.modal.show(newView);
}

该视图依次以相同的方式显示另一个模式对话框。

(_.extend(Marionette.Region.prototype, Backbone.Events, {...})

App.modal功能是backbone.marionette.js的一部分，在show方法的某个地方出了问题。很难确定哪里因为当我单步执行调试时，在show方法的最后一行有一个断点（设置this.currentView = view;）然后第二个模态显示正常，即使在继续之后也不会消失。没有断点，第二个模态每次都会消失。所以可能存在一些时间问题。

当我点击第二个对话框时，我看到它正确格式化，然后消失;在渲染后不久它看起来就像杀了它一样，我在单页应用程序中留下了黑色覆盖，模式应该是。

我已尝试在两个点击处理程序中添加对e.stopPropagation（）和e.preventDefault（）的调用，但它们无法解决问题。

第一个模态是项目列表，第二个模态是其中一个项目的详细视图，因此列表必须首先渲染，然后弹出第二个模态的单击事件处理程序附加到表格行。

第一个模态是Marionette.CompositeView的一部分，它是Marionette.Layout上的一个区域。

Answer 1

当您点击第二个对话框时，第一个关闭时就会发出声音。如果是这样，关闭第一个对话框的代码可能都会关闭。您可以向close函数添加一个可选参数，以验证要关闭的元素的ID。

另一个解决方案，您可以切换到一个模态。将项目详细信息视图作为JSON和模板以及列表视图提供。然后单击，而不是调用新模式，只需渲染＆amp;在现有模态中显示。

Answer 2

听起来您正在使用Twitter Bootstrap模式插件？我遇到了与使用它相同的问题。

问题本质上是如果你快速连续调用.modal（'hide'）然后调用.modal（'show'）会让人感到困惑 - 我相信这是因为它使用的CSS转换尚未完成并且在它仍在转换时显示get。我的解决方案有点复杂，但解决这个问题的一个简单方法是在触发show之前先听一下'hidden.bs.modal'事件。根据文档：

“当模态完成对用户隐藏时将触发此事件（将等待CSS转换完成）。

Backbone Marionette - 在模态对话框之间转换

2 个答案: