0

在主干中渲染视图时，您需要准备好几个资源。如果你想制作下拉列表，它可以是国家、城市和邮政编码的列表。我想知道什么是正确的方法，以便每次调用渲染函数时所有资源都准备好？

我正在考虑使用默认渲染事件，我可能会像这样使用延迟的 Jquery？

render: function(){
    var listofajaxcall = setupResource(); //returns array of ajax call
    var self = this;
    $.when(listofajaxcall){
    }.done(){
       self.rendering();
    }
},
rendering: function(){
   //do something 
}
4

1 回答 1

1

这是一种方法，也是一种常见的解决方案。

从setupResource调用中返回一个 Promise 将允许延迟视图渲染，直到资源准备好。

您可能还想做的一件事是从您的rendering方法中触发一个事件来说明视图何时完成渲染：


render: function(){
    var listofajaxcall = setupResource(); //returns array of ajax call
    var self = this;
    $.when(listofajaxcall){
    }.done(){
       self.rendering();
    }
},
rendering: function(){
   //do something 

   // after it's done...
   this.trigger("rendered");
}

这样，您可以侦听呈现的事件并调用需要在呈现视图后运行的其他代码。

我更喜欢的另一种方式是在视图之外设置代码，这样视图就不必处理异步代码。



var foo = {

  bar: function(){

    var listofajaxcall = setupResource();

    var self = this;
    $.when(listofajaxcall).then(someResource){

       var view = new MyView({
         someResource: someResource
       });
       view.render();
       $("#whatever").html(view.el);

    }
  }

}

foo.bar();

在这个版本的代码中，视图对异步一无所知。它是控制应用程序中逻辑流的代码。这样做的缺点是，如果您想在屏幕上显示“正在加载...”消息，您必须先渲染另一个视图。这是值得的 IMO，因为它使正在完成的工作流程更加明确。

于 2012-09-01T12:27:37.493 回答