Question

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

我在想使用默认的渲染事件我可能会使用Jquery defered吗？

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

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

在此版本的代码中，视图不了解异步。它是控制应用程序中知道它的逻辑流程的代码。这样做的缺点是，如果您想在屏幕上添加“loading ...”消息，则必须先渲染另一个视图。这值得IMO，因为它使工作流程更加明确。

在渲染之前准备好所有资源

1 个答案: