Um die Ansicht zu verwalten haben wir mehrere Optionen, wir wissen, dass wir eine Template-Engine haben müssen, das Interessante ist, dass wir eine der vielen Optionen verwenden können und um uns dies zu erlauben, haben wir die render() Methode Dies ist diejenige, die die Vorlage aufruft und die Daten anzeigt.
Render()-Methode
Wenn wir die Logik zum Anzeigen einer Vorlage definieren müssen, können wir die optionale render()-Methode.
WichtigIn diesem Tutorial verwenden wir Unterstreichen als Template-Engine und zusätzlich nehmen wir folgenden HTML-Code als Basis:
Hier sehen wir, wie wir einen Block machen zu dem wir definieren, dass sein Typ sein wird Text / Vorlage und wir fügen hinzu eine ID-Vorlage, dies hilft uns beim Senden der Informationen an die Vorlagen-Engine.
Funktion
Es gibt eine Methode in Unterstreichen namens ._Schablone die den Vorlagencode in Javascript kompiliert und in Funktionen umwandelt, die wir dann auswerten und anzeigen können.
Zum Beispiel übergeben wir der Methode die Labels, die sie verwenden wird, indem wir eine ID verwenden, im Fall des vorherigen Codes ist die ID-Vorlage die ._template-Methode Sie wissen bereits, wohin Sie die Daten zurückgeben müssen.
Dann er render() Methode verwendet die Vorlage, indem Daten mit der Methode . übergeben werden zuJSON () was in gewisser Weise die Attribute des Modells übersetzt, das wir der Ansicht zugeordnet haben. Dann gibt das Template das konkrete HTML zurück und wir fügen es dem DOM-Baum des Dokuments mit dem Eigenschaft $ the.
Das mag nach viel Arbeit klingen, aber alles wird wirklich vom Framework zusammen mit der Template-Engine erledigt, daher ist unser Eingriff viel einfacher, als wenn wir all dies ohne Ihre Hilfe tun müssten.
Anwendungsbeispiele
Es gibt eine Konvention, in der wir müssen gib das zurück am Ende der Methode rendern (), Dies hilft uns, Ansichten in anderen Ansichten wiederverwendbar zu machen und auch Listen von Elementen zu erstellen, die gezeichnet werden, sobald alle Elemente vorhanden sind und nicht einzeln, wodurch wir ein wenig Ressourcen sparen.
Sehen wir uns unten ein Bild eines Beispiels zum Erstellen einer Listenansicht an:
Wir sehen das in der Methode rendern () Wir verwenden dies, um die Eigenschaft zu erweitern $ die, den Inhalt des Modells und dann können wir das alles mit dem zurückgeben gib das zurück.
Ziemlich einfach zu implementieren, aber sehr hilfreich, da wir diese Liste damit sogar als Unteransicht innerhalb anderer übergeordneter Ansichten verwenden können.
Wir beenden das Tutorial, wenn wir die Methode kennen rendern () und seine große Bedeutung bei der Definition von Ansichten, die wiederverwendbar sind.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