Backbone 视图的默认值

Question

我有这个烦人的问题，我感觉这是因为我们不能像使用 Backbone 模型那样使用 Backbone Views 的默认值。我的目标是使用带有 Backbone 视图的默认值，然后根据需要使用传递给初始化函数的选项覆盖它们。我遇到的问题是，当我调用 this.collection Backbone 时，它​​与 this.defaults.collection 不匹配，正如我所期望的那样。当我在初始化函数中调用 this.collection 时，我得到一个空点异常，即使我在默认值中分配了集合。

也许我需要的是我的初始化函数中的这个调用：

  this.options = _.extend(this.defaults, this.options);

然而，在这种情况下，默认值并没有做任何特别的事情。 this.defaults 可以称为 this.cholo。我想我想知道为什么默认值/属性与骨干模型的行为不同。

我有以下代码：

var IndexView = Backbone.View.extend({

                el: '#main-div-id',

                defaults: function(){
                    return{
                        model: null,
                        collection: collections.users,  
                        childViews:{
                            childLoginView: null,
                            childRegisteredUsersView: null
                        }
                    }
                },

                events: {
                    'click #loginAsGuest': 'onLoginAsGuest',
                    'click #accountRecoveryId': 'onAccountRecovery'
                },

                initialize: function (opts) {

                    this.options = Backbone.setViewOptions(this, opts);
                    Backbone.assignModelOptions(this,this.options);

                    _.bindAll(this, 'render', 'onFetchSuccess', 'onFetchFailure');

                    this.listenTo(this.collection, 'add remove reset', this.render);  //this.collection is not defined here

                    this.collection.fetch({ //null pointer here, this.collection is not defined
                        success: this.onFetchSuccess.bind(this),
                        error: this.onFetchFailure.bind(this)
                    });
                },

                render: function () {
                  //removed code because it's extraneous for this example

                },

                onFetchSuccess: function () {},

                onFetchFailure: function () {}
            },
            { //classProperties

                givenName: '@IndexView'
            });

...顺便说一下，为了让每个视图实例的事件不同，我应该把事件变成一个类似于默认值的函数吗？

Answer 1

Backbone.Model 中的 defaults 文字确实没有什么特别之处。如果您看一下Backbone source，他们实际上是在模型构造函数中执行此操作

Backbone.Model = function( attributes, options ) {
  // simplified for example
  var attrs = _.defaults( {}, attributes, this.defaults );
  this.set( attrs, options );
};

您可以在设置视图时采用完全相同的方法

var myView = Backbone.View.extend( {
  options: {
    // your options
  },

  initialize: function( options ) {
    this.options = _.defaults( {}, options, this.options );
  }
} );

如果您想将您的选项定义为一个函数，以便在运行时对其进行评估，您可以使用以下

var myView = Backbone.View.extend( {
  options: function() {
    // your options
  },

  initialize: function( options ) {
    this.options = _.defaults( {}, options, _.result(this, 'options') );
  }
} );

要回答您关于每个实例的不同事件的其他问题，是的，您可以将其定义为一个函数并在该函数中包含逻辑，或者在实例化视图时简单地将 events: { ... } 作为选项传递。

希望这会有所帮助。