Backbone 应用程序的结构。型号/系列问题

Question

我的应用程序的逻辑非常简单。我有获取 JSONP 的模型（数据包含年、季度和季度包含不同的键：值）。获取数据后，View 会监听 Model 的“change”事件，然后渲染数据。到目前为止一切顺利。

但是我需要监听“change:year”/“change:quarter”并根据更改使用新的 url 获取数据。但是当 "change:year"/"change:quarter" 被触发时，全局 "change" 也会被触发。

当然，如果我使用 Collection 而不是 Model – 对我来说就是“重置”。但在这种情况下，我不能这么容易地听“change:year”——我必须再创建几个模型（对于年、季度和季度中的每个键）。但我想让应用程序保持简单。

还有其他方法吗？或者创建更多模型是不可避免的？

谢谢。

UPD：仍然需要“更改”事件，因为模型必须在获取新数据后重新渲染。

解决方案：我创建了通用控制器，它包含需要更改的属性。并在 .url() 方法中从 Controller 获取它们以修改 url。我坚持使用 Collection 的 fetch()/"reset" 通知并在“更改”时为 Controller 设置监听器。因此，当我更改“年”/“季度”时，View 会从 Controller 获取通知，并且当相应的 Collection 获取时 - 它正在使用新的 url 获取。

Answer 1

据我了解，如果仅更改了 year 或 quarter，您不希望收到全局模型 change 事件 - 但您必须这样做。

因此，在收到全局更改事件时，您可以检查是否只有year 或quarter 是changed，并跳过正常的事件处理。像这样的：

this.model.bind("change", this.render, this);
this.model.bind("change:year", this.fetchSomething, this);
this.model.bind("change:quarter", this.fetchSomething, this); 

render : function(){
    var attributesExceptYearAndQuarter = _.without(this.model.attributes, ['year', 'quarter']) 
    if(this.model.changedAttributes(attributesExceptYearAndQuarter).length > 0){
         // do the rendering
    } 
}

Answer 2

您可以在模型的更改侦听器中检查更改的属性。

var MyModel=Backbone.Model.extend({
    initialize:function(){
      this.bind("change",this.changeModel);
      this.bind("change:year",this.changeYear);

   },
   changeModel:function(model,objs){
      //Checking changed attributes
      if (_.has(objs.changes,"year") || _.has(objs.changes,"quarter")) return this;

     console.log("Processing",objs.changes);
     return this;
  },
   changeYear:function(model,new_val){
    console.log("year changed.",new_val);
    return this;
  }

});


var mymodel=new MyModel();
mymodel.set("year",2012); 
mymodel.set("month",6);

如果你有一个监听模型的改变事件的视图，你应该给模型添加一个不同的属性并监听这个属性的改变事件而不是模型的改变事件并且在这个属性改变时渲染视图。如果您的“年”和“季度”属性未在更改的属性中，请在 changeModel 函数中更改此属性的值并触发侦听器，如下所示。

//Edit changeModel as below
changeModel:function(model,objs){
          //Checking changed attributes
          if (_.has(objs.changes,"year") || _.has(objs.changes,"quarter")) return this;

          this.set("rerender",!this.rerender); //Changing for triggering change event
         return this;
      },


//View's constructor function
initialize:function(){
   this.model.bind("change:rerender",this.render);
}