屏幕尺寸更改时重新执行api调用

时间:2015-10-07 13:47:26

标签: javascript backbone.js marionette

当屏幕宽度发生变化时,如何在Backbone Marionette中执行此操作,重新执行提取?现在,我的代码必须重新加载才能检查浏览器的宽度。

device = getDevice(); // returns desktop or mobile based on $(window).width();

if (device === 'desktop') {
  // let's pull desktop data
  this.desktop = new desktopItemModel({device: 'desktop'});
  this.desktopPromise = this.desktop.fetch();
}

if (device === 'mobile') {
  // let's pull mobile data
  this.mobile = new mobileItemModel({device: 'mobile'});
  this.mobilePromise = this.mobile.fetch();
}

this.allPromise = [desktopPromise, mobilePromise];

if (device === 'desktop') {
    $.when(this.desktopPromise).done(_.bind(function() {
        // do your desktop stuff
    }, this));
}
if (device === 'mobile') {
    $.when(this.mobilePromise).done(_.bind(function() {
        // do your mobile stuff
    }, this));
}

1 个答案:

答案 0 :(得分:1)

我认为您的代码可能会受益于某些重组。

var model;

function getData () {
  model = new Model(type: device)
  model.fetch().then(doStuff)
}

function doStuff () {
  if (model.type == 'desktop') {
    // desktop stuff
  } else {
    // mobile stuff
  }
}

window.addEventListener("resize", _.debounce(fetchData, 1000))
// some browsers trigger a lot of resize events, others just at the end
fetchData()