2012-04-11 9 views
0

Sortieren von einem Anfänger JavaScript-Person liest ein Backbone.js Tutorial http://arturadib.com/hello-backbonejs/docs/5.html und haben ein paar Fragen über einige der Code der Autor verwendet.Was löst die Change-Funktion in zurück

In der Initialisierungsfunktion unten bindet der Autor

this.model.bind('change', this.render); 
    this.model.bind('remove', this.unrender); 

Ich gehe davon aus bedeutet dies, die render Funktion auf dem ‚this‘ Objekt aufgerufen wird, wenn die Änderungsfunktion aufgerufen wird, und unrender wird ausgeführt, wenn remove wird genannt. Das Problem für mich ist, dass es eine definierte Funktion 'remove' in seinem Code, aber keine definierte Funktion 'change'

Frage: change und remove beziehen sich auf jquery Funktionen oder hat die remove Funktion auf die remove Funktion in der verweisen definiert code (dh es überschreibt die jquery-Funktion), während sich change auf die jquery-Funktion bezieht. Wenn letzteres, was löst genau die 'change' Funktion aus, wenn es nie explizit aufgerufen wird und daher die render Funktion?

-Code

var ItemView = Backbone.View.extend({ 
    tagName: 'li', // name of tag to be created   


    events: { 
     'click span.swap': 'swap', 
     'click span.delete': 'remove' 
    },  


    initialize: function(){ 
     _.bindAll(this, 'render', 'unrender', 'swap', 'remove'); // every function that uses 'this' as the current object should be in here 

     this.model.bind('change', this.render); 
     this.model.bind('remove', this.unrender); 
    }, 


    render: function(){ 
     $(this.el).html('<span style="color:black;">'+this.model.get('part1')+' '+this.model.get('part2')+'</span> &nbsp; &nbsp; <span class="swap" style="font-family:sans-serif; color:blue; cursor:pointer;">[swap]</span> <span class="delete" style="cursor:pointer; color:red; font-family:sans-serif;">[delete]</span>'); 
     return this; // for chainable calls, like .render().el 
    }, 


    unrender: function(){ 
     $(this.el).remove(); 
    }, 


    swap: function(){ 
     var swapped = { 
     part1: this.model.get('part2'), 
     part2: this.model.get('part1') 
     }; 
     this.model.set(swapped); 
    }, 



    remove: function(){ 
     this.model.destroy(); 
    } 
    }); 

Antwort

2

Die change und remove Backbone-Ereignisse sind Ereignisse nicht jQuery. Diese:

this.model.bind('change', this.render); 
this.model.bind('remove', this.unrender); 

bedeuten, dass this.render wird aufgerufen, wenn das Modell löst ein change Ereignis und this.unrender wird aufgerufen, wenn das Modell ein remove Ereignis auslöst. Die set method on models:

setzen einen Hash von Attributen model.set(attributes, [options])

Stellen (eine oder mehrere) auf dem Modell. Wenn eines der Attribute den Modellstatus ändert, wird ein "change"-Ereignis ausgelöst, sofern nicht {silent: true} als Option übergeben wird.

ist ein Weg eines Modells change Ereignis auszulösen, unset und clear auch change Ereignisse auslösen.

remove Ereignisse stammen in der Regel aus Sammlungen, aber die Sammlung sendet sie über die entsprechenden Modelle, falls Ansichten zuhören.

Sie möchten vielleicht lesen Sie die (ziemlich gut) Backbone documentation und überprüfen Sie die Catalog of Events insbesondere.

+0

Vielen Dank. Ich verstehe das Änderungsereignis jetzt, aber welche Auslöser werden in diesem Code entfernt? Ist es der ausdrückliche Aufruf zum "Entfernen" und wenn das nicht existiert, wie würde Entfernen ausgelöst werden? – Leahcim

+0

@Michael: Ich sehe dort nichts, das ein 'remove' Ereignis auslösen würde, das normalerweise von [' Collection # remove'] kommt (http://documentcloud.github.com/backbone/#Collection-remove) . Die 'remove' Methode in der Ansicht würde ein [' destroy'] (http://documentcloud.github.com/backbone/#Model-destroy) Ereignis auslösen. –

+0

so ist diese Linie unbedeutend? this.model.bind ('remove', dies.Unrender); Ich dachte, dass Remove für Unrender ausgelöst werden muss, um dann ausgelöst zu werden. – Leahcim

Verwandte Themen