1

我们正在使用 Marionette.js，并希望我们可以根据窗口的大小来切换布局的活动模板。但是，该getTemplate()函数似乎只在视图加载时调用一次。

在 Marionette 中加载布局后，有没有办法切换当前模板？我们有这个代码：

initialize: function() {
    //... other code
    this.windowWidth = 0;
    $(window).resize(this.resizeHandler);
},

getTemplate: function () {
    if (this.windowWidth <= 1050) {
      return "#small-screen-template"; 
    }
    return "#large-screen-template"; 
},

resizeHandler: function () {
    this.windowWidth = $(window).width();
}
4

1 回答 1

2

这尚未经过全面测试，但您可以更改您的初始化方法以包括对“渲染”的调用。此外，您不应该忘记事件处理程序的清理。

基本上将初始化更改为：

initialize: function(options) {
    //..
    this.windowWidth = 0;

    $(window).on("resize", this.resizeHandler);
    $(window).on("resize", this.render);       
}

并添加清理方法（来自木偶的onClose ）：

onClose: function() {
    $(window).off("resize", this.resizeHandler);
    $(window).off("resize", this.render);                
}

通过做这个：

  • 当屏幕调整大小时 windowWidth 正确更新
  • 之后调用另一个回调，它将重新渲染视图
  • 当视图关闭时，来自窗口对象的回调被释放

理论上应该有效，未经任何测试

于 2013-07-04T13:09:28.450 回答