Inhaltsverzeichnis
Backbone.js Es basiert auf der MVC-Struktur und hat zusätzlich zu Modelle, hat auch AnsichtenGemäß der Philosophie dieser Softwarekonstruktionsarchitektur sind die Ansichten diejenigen, die dafür verantwortlich sind, dem Benutzer die Daten anzuzeigen, die zwischen der Steuerung und dem Modell je nach gestellter Anfrage generiert werden.In Backbone.js das funktioniert etwas anders, die Ansicht enthält keine Elemente, die der Benutzer direkt sieht, sondern kommuniziert die Daten über eine Template-Engine.
Die Ansichten in Backbone.js
In Backbone.js die Ansichten als solche enthalten keine HTML-Sprache, die dem Benutzer unserer Anwendung angezeigt werden kann, im Gegenteil, sie enthalten die Logik, die es uns ermöglicht, den Betrieb des vorderen Teils der Anwendung, die wir entwickeln, unter Verwendung des Modells zu erstellen eine Basis, das heißt, was wir im Modell haben, werden wir in der Ansicht manipulieren und haben somit zwei Aktionsebenen.
Zur Anzeige von Daten verwenden wir die render() Methode das ermöglicht es uns, die Daten aus unserer Ansicht an eine Vorlage zu übergeben, die Vorlage ist in einer Engine von . eingebaut Javascript-Vorlagen zum Beispiel: Unterstrich, Schnurrbart, Jquery-tpml usw..
Erstellung ansehen
Zu eine Ansicht erstellen Wir folgen einem ziemlich direkten Prozess und ähnlich wie bei der Erstellung eines Modells, um die Ansicht zu generieren, von der wir nur ausgehen müssen Backbone.Ansicht, mal sehen, wie sich das verhält, wenn wir es auf unserem laufen lassen Chromkonsole Verwenden einer HTML-Datei mit den Bibliotheken von Backbone.js, jsquery Ja unterstreichen schon geladen.
Sehen wir uns zuerst den Code an, den wir in unsere Konsole einfügen werden:
var TodoView = Backbone.View.extend ({tagName: 'li', // Cache der Vorlagenfunktion für ein einzelnes Element. todoTpl: _.template ("Eine Beispielvorlage"), events: {'dblclick label ':' edit ',' keypress .edit ':' updateOnEnter ',' blur .edit ':' close '}, // Überschrift des Elementlabels neu generieren render: function () {this. $ el.html (this.todoTpl ( this.model.toJSON ())); this.input = this. $ ('. edit'); return this;}, edit: function () {// Sie wird ausgeführt, wenn Sie auf das Tag} doppelklicken, schließen : function () {// sie wird ausgeführt, wenn der Fokus vom Element entfernt wird}, updateOnEnter: function (e) {// sie wird ausgeführt, wenn im Editiermodus eine Taste gedrückt wird, // jedoch warte, bis die Eingabe erfolgt gedrückt, um in Aktion zu treten}}); Wie wir sehen können, nachdem wir die erweitern Dementsprechend initialisieren wir eine Reihe von Attributen, die unsere Ansicht zum Laufen bringen, zusätzlich platzieren wir in jedem Element die Kommentare, damit wir wissen, wie es funktioniert.
Sehen wir uns nun in der Konsole an, was passiert, wenn wir die Ansicht aufrufen:
Damit schließen wir dieses Tutorial ab, mit dem wir bereits einen Schritt nach vorne gemacht haben, was der Generierung von Ansichten in einer MVC-Anwendung mit . entspricht Backbone.js.Hat dir dieses Tutorial gefallen und geholfen?Sie können den Autor belohnen, indem Sie diesen Knopf drücken, um ihm einen positiven Punkt zu geben
