当屏幕尺寸发生变化时重新执行api调用

Question

如果在屏幕宽度发生变化时重新执行抓取，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)); 
} 

Answer 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()