Backbone 网中自定义事件的优势是什么?

polkgigr  于 2022-11-24  发布在  其他
关注(0)|答案(2)|浏览(148)

我了解自定义事件在Backbone中是如何工作的,以及如何触发它们,但我很难理解何时确切地使用它们,以及它们与直接调用函数相比有什么目的。
例如:

var MyView = Backbone.View.extend({
    tagName: 'div',
    className: 'myview',

    initialize: function() {
        this.model.on("mycustomevent", this.doSomething, this);
    },

    doSomething: function() { 
         console.log('you triggered a custom event');
    }

});

如果我没有弄错的话,doSomething方法可以在其他方法中使用this.model.trigger("mycustomevent")调用,但也可以直接使用this.doSomething()调用
在视图之外,它可以类似地用

var myview = new MyView({model:somemodel});

myview.model.trigger("customevent");

myview.doSomething();

我感到困惑的是,为什么不放弃自定义事件,而在需要的时候直接调用该方法呢?任何示例使用都将非常感谢!

ztmd8pv5

ztmd8pv51#

您可能希望在代码中的不同位置添加多个处理程序,例如:

this.model.on("mycustomevent", this.doSomething, this);

// ... and somewhere else you add an anonymous function
this.model.on("mycustomevent", function() {
    console.log('do something');
});

然后当你触发事件时,它会执行所有的处理程序。你也可以使用off来解除绑定/管理单个或多个处理程序。
如果您想了解事件模式(也称为observer patternpublish/subscribe 等)的一般解释,您可能应该查找更深入的文章或书籍。

gzszwxb4

gzszwxb42#

对于 Backbone.js ,最好的例子是改变模型的属性。使用函数,你必须做这样的事情...

$( '#someUI' ).click( function {
   // update the model property
   myModel.someProperty = 'somethingDifferent';
   // update any ui that depends on this properties value
   $( '#uiThatDisplaysModelData' ).find( 'someSelector' ).html( 'somethingDifferent' );
   // save the model change to the server
   $.ajax( {
      url: 'somesaveurl',
      data: { someProperty: 'somethingDifferent' }
      success: callback
   } );
} );

然后对每个属性更改在代码中重复这些步骤。
有了 Backbone.js 和一点设置,同样的事情可以完成:

myModel.set( 'property', 'somethingDifferent' );

这是因为我们已经为这个模型的changechange:property事件附加了处理程序。这些是由 Backbone.js 自动为模型创建的自定义事件。因此,每当代码的任何部分操作模型时,DOM更新和保存都可以自动完成。我们还可以将输入验证或任何我们想要的东西绑定到这些自定义事件。
基本上就是将观察者模式应用到应用程序中,其中事件属于可观察的对象,处理程序属于其观察者。
http://en.wikipedia.org/wiki/Observer_pattern

相关问题