4

ネストされたバックボーンビューで作業しています。クリックすると、同じビューの新しいインスタンスが作成されます。すべてではなく、特定のイベントのみを無効にしたい。この場合、クリックします。undelegateEvents（）を使用してみましたが、これによりすべての関数が無効になります。これをどのように行うことができるかについてのアイデアはありますか？

これが私が取り組んでいるコードの一部です：

var View = Backbone.View.extend({
    events: {
        "mousedown": "start",
        "mouseup": "over"
    },

    start: function() {
        var model = this.model;

        var v = new View({
            model: model,
        });
        v.undelegateEvents(); //I just want to disable mousedown
        v.render();
    },

    over: function() {
        /*
        some code here
        */
    },

    render: function() {
        /*
        some code here
        */
    }
});

アイデアは、他のイベントを保持しながら、2番目のインスタンス化されたビューのクリックを禁止することです。最初のものには、すべてのイベントがあります。

ありがとう

4

2 に答える 2

7

呼び出すときに使用するイベントを指定できますdelegateEvents。

デリゲートイベント delegateEvents([events])

jQueryのdelegate関数を使用して、ビュー内のDOMイベントの宣言型コールバックを提供します。イベントハッシュが直接渡されない場合はthis.events、ソースとして使用します。

したがって、次のようなことができます。

var v = new View({
    model: model,
});
v.undelegateEvents();
var e = _.clone(v.events);
delete e.mousedown;
v.delegateEvents(e);
v.render();

ただし、そのロジックをViewのメソッドにプッシュすることをお勧めします。

detach_mousedown: function() {
    this.undelegateEvents();
    this.events = _.clone(this.events);
    delete this.events.mousedown;
    this.delegateEvents();
}

//...

v.detach_mousedown();

1つのオブジェクトのみを変更したい場合にthis.events = _.clone(this.events)、誤って「クラス」 （つまり、this.constructor.prototype.events）を変更しないようにするためのトリックが必要です。eventsコンストラクターのフラグを設定して、Viewその内部で同様のことを行うこともできinitializeます。

initialize: function() {
    if(this.options.no_mousedown)
        this.detach_mousedown()
    //...
}

別のオプションは、ハンドラーのないベースビューを作成しmousedown、それをハンドラーのあるビューに拡張することですmousedown。

var B = Backbone.View.extend({
    events: {
        "mouseup": "over"
    },
    //...
});
var V = B.extend({
    events: {
        "mousedown": "start",
        "mouseup": "over"
    },
    start: function() { /* ... */ }
    //...
});

プロパティをマージしないので、B.events内部を複製するVか、マニュアルextendをいじくり回す必要があります。それは、物事を大規模に置き換えるだけです。events_.extend

于 2012-06-01T21:45:46.673 に答える
1

これは、バックボーンビュー内でイベントを委任または解除する方法を示す簡単な例です。

Backbone.View.extend({

    el: $("#some_element"),

    // delete or attach these as necessary
    events: {
        mousedown: "mouse_down",    
        mousemove: "mouse_move",
        mouseup: "mouse_up",
    },  

    // see call below
    detach_event: function(e_name) {
        delete this.events[e_name]
        this.delegateEvents()
    },  

    initialize: function() {        
        this.detach_event("mousemove")      
    },  

    mouse_down: function(e) {       
        this.events.mousemove = "mouse_move"
        this.delegateEvents()       
    },

    mouse_move: function(e) {},

    mouse_up: function(e) {}

})
于 2013-07-04T14:00:39.777 に答える