wie backbone.js Modell Fetch-Methode funktioniert

Question

Ich bin sehr verwirrt über die Verwendung von Backbone.js Model Fetch-Methode. Siehe das folgende Beispiel
Backbone-Router:

profile: function(id) { 
    var model = new Account({id:id}); 
    console.log("<---------profile router-------->"); 
    this.changeView(new ProfileView({model:model})); 
    model.fetch(); 
} 

der erste Schritt wird das Modell Konto instanziert werden, das Kontenmodell sieht wie folgt aus.

define(['models/StatusCollection'], function(StatusCollection) { 
    var Account = Backbone.Model.extend({ 
    urlRoot: '/accounts', 

    initialize: function() { 
     this.status  = new StatusCollection(); 
     this.status.url = '/accounts/' + this.id + '/status'; 
     this.activity  = new StatusCollection(); 
     this.activity.url = '/accounts/' + this.id + '/activity'; 
    } 
    }); 

    return Account; 
}); 

urlRoot-Eigenschaft für was ist das? Nach dem Erstellen des Modellobjekts wird die Profilansicht mit dieser this.changeView gerendert (neues ProfileView ({model: model}));, sieht die changeview-Funktion so aus.

changeView: function(view) { 
    if (null != this.currentView) { 
    this.currentView.undelegateEvents(); 
    } 
    this.currentView = view; 
    this.currentView.render(); 
}, 

nach Ansicht machen, werden Informationen über die Profile noch nicht angezeigt werden, aber nach model.fetch(); Anweisung ausführen, Daten vom Modell werden angezeigt, warum? Ich weiß wirklich nicht wie fetch funktioniert, ich versuche es herauszufinden, aber keine Chance.

Answer 1

Ich bin nicht ganz sicher, was Ihre Frage hier ist, aber ich werde mein Bestes tun, um zu erklären, was ich kann.

Das Konzept hinter dem URLRoot ist, dass die Basis-URL und darunter Elemente mit der ID, die zu diesem URLRoot hinzugefügt wurde, darunter abgerufen werden.

Zum Beispiel der folgende Code:

var Account = Backbone.Model.extend({ 
    urlRoot: '/accounts' 
}); 

wird die Basis-URL gesetzt. Dann, wenn Sie diese instanziiert sind und rufen Sie holen():

var anAccount = new Account({id: 'abcd1234'}); 
anAccount.fetch(); 

es würde den folgenden Antrag stellen:

GET /accounts/abcd1234 

In Ihrem Fall, können Sie die UrlRoot setzen und dann eine URL explizit einstellen Der von Ihnen angegebene urlRoot wird also ignoriert.

ich Sie ermutigen, in die Backbone-Quelle zu sehen (es ist erstaunlich prägnant), um zu sehen, wie die URL abgeleitet: http://backbonejs.org/docs/backbone.html#section-65

Ihre andere Frage zu beantworten, der Grund, Ihre Profilinformationen nicht sofort angezeigt wird, ist, dass holen () geht zum Netzwerk, geht zu Ihrem Server und muss auf eine Antwort warten, bevor es angezeigt werden kann.

Dies ist nicht sofort.

Es erfolgt nicht blockierend, was bedeutet, dass es die Anfrage macht, weiter macht, was es tut, und wenn die Anfrage vom Server zurückkommt, löst es ein Ereignis aus, das Backbone verwendet, um irgendetwas anderes sicherzustellen das musste getan werden, jetzt, da Sie die Daten des Modells haben, ist fertig.

Ich habe einige Kommentare in Ihrem Snippet setzen zu erklären, was hier vor sich geht:

profile: function(id) { 
    // You are instantiating a model, giving it the id passed to it as an argument 
    var model = new Account({id:id}); 
    console.log("<---------profile router-------->"); 

    // You are instantiating a new view with a fresh model, but its data has 
    // not yet been fetched so the view will not display properly 
    this.changeView(new ProfileView({model:model})); 

    // You are fetching the data here. It will be a little while while the request goes 
    // from your browser, over the network, hits the server, gets the response. After 
    // getting the response, this will fire a 'sync' event which your view can use to 
    // re-render now that your model has its data. 
    model.fetch(); 
} 

Also, wenn Sie die Ansicht sicherstellen wollen, wird aktualisiert, nachdem das Modell gibt Ihnen ein paar Möglichkeiten sind, können abgerufen wurde tun Sie das: (1) übergeben Sie einen Erfolgsrückruf an das Modell.fetch() (2) registriert einen Handler in Ihren View-Uhren für das Ereignis 'sync', rendert die Ansicht neu, wenn sie zurückkommt (3) den Code zum Instanziieren Ihrer Ansicht in einen Erfolgs-Callback setzen, so wird die Ansicht nicht erstellt werden, bis die Netzwerkanforderung zurückgegeben wird und Ihr Modell über die Daten verfügt.