[JAVA] Wechseln Sie von JSP + JSTL zu Thymeleaf

Es ist der 7. Tag von Asoview Adventskalender 2019.

Ich bin Azuma, die braune Ratte vom Backend-Entwicklungsteam. Dieses Mal werde ich die Korrespondenztabelle einführen, wenn ich die JSP + JSTL-Funktion, die seit langem in Java-Webanwendungen verwendet wird, durch Thymeleaf ersetze.

Übertragung von JSP + JSTL nach Thymeleaf

JSP war früher die De-facto-Methode zum Erstellen von Java-Webanwendungen, aber jetzt, da Spring Boot Thymeleaf übernommen hat, gibt es Fälle, in denen die Präsentation aufgrund des Ersetzens vorhandener Anwendungen von JSP auf Thymeleaf ersetzt wird [^ 2].

Dieses Mal werde ich vorstellen, wie die in JSTL verwendete Funktion der in der alten Java-Webanwendung verwendeten JSP + -Tag-Bibliothek zusammen mit der Funktionskorrespondenztabelle durch Thymeleaf ersetzt wird.

[^ 2]: Ursprünglich wurde HTML von einem Servlet als Zeichenfolge ausgegeben, aber JSP ermöglicht das Schreiben von Java-Code, indem HTML als eine Vorlage betrachtet wird. Die Betriebsgeschwindigkeit von JSP ist jedoch nicht gut, die Lesbarkeit verschlechtert sich, da die Tags in den Tags überlagert werden und der JSP-Code zum ursprünglichen HTML-Code hinzugefügt wird. Wenn also das Bildschirmdesign oder -layout geändert wird, werden HTML und JSP geändert Die Wartbarkeit war nie gut, wie zum Beispiel Differenzkorrekturen.

Was ist diesmal angestrebt?

Zusätzlich zu JSTL-Tags werden wir auch Dinge im Zusammenhang mit der Verwendung von JSP- und EL-Ausdrücken vorstellen.

Unzutreffend

[^ 1]: Es gibt eine Möglichkeit, das Thymeleaf-Spring-Plug-In zu verwenden, um auf eine Datenquelle von einer Spring-Management-Bean zu verweisen und diese auszugeben, insbesondere auf eine Klasse mit "@ Service" und "@ Repository". Es sollte jedoch eine angemessene Transaktionsverwaltung und Ressourcenzuweisung durchgeführt werden, und zwischengespeicherte Inhalte sollten nach Bedarf zurückgegeben werden.

Kern (Namensraum: c)

Das Core-Tag ist ein häufig verwendetes Tag, z. B. Wertausgabe und bedingte Verzweigung.

Jetzt werde ich jede Funktion und jedes Verwendungsbeispiel vorstellen, während ich sie vergleiche.

th: text: Ausgabe in Tag-Text (= Elementwert)

Ausgabe auf Elementwert

<div>Botschaft</div>

Um dies anzuzeigen, vergleichen wir den Fall der Übergabe von Name: Nachricht und Wert: Nachricht.

Thymeleaf gibt die im Elementwert des div geschriebenen Textzeichen als Inhalt von th: text aus. In JSP wird es angezeigt, auch wenn es nicht über "<c: out>" ausgegeben wird, sondern immer über "<c: out>" von JSTL, um den Ausgabewert zu bereinigen.

Ausgabe an Attributwert

<input type="text" value="Botschaft" />

Um dies anzuzeigen, die Art zu schreiben, wenn bei der Übergabe von Name: Nachricht, Wert: Nachricht,

Der Wert wird wie folgt umgeschrieben: ** Geben Sie denselben Attributnamen wie das Attribut an, das Sie ausgeben möchten **, was auch eine Funktion von Thymeleaf ist. Andererseits ist es in JSP / JSTL etwas schwierig zu lesen, da es sich um eine Beschreibung handelt, die den Wert innerhalb des Attributwerts des Tags ausgibt und ihn weiter in das Tag einschließt.

String-Verkettung

Die Verkettung von Zeichenfolgen ist auch innerhalb der Attribute in Thymeleaf möglich. Wenn Sie die Zeichenfolge direkt schreiben, schließen Sie sie in einfache Anführungszeichen ein.

<div th:text="'das ist,' + ${message} + 'ist'">Text</div>

Das Ausgabeergebnis davon ist

<div>Dies ist eine Nachricht</div>

th: with: Wert in temporärer Variable speichern

Sie können den Ausgabewert während der Ausgabe von HTML wiederholt verwenden oder den Wert neu zuweisen, um den Ausgabeinhalt zu ändern.

In Thymeleaf-Vorlagen definierte temporäre Variablen können von dem Element referenziert werden, das die temporäre Variable sowie ihre untergeordneten Elemente definiert. An Thymeleaf Name: Nachricht, Wert: Wenn als Nachricht übergeben

<div th:with="anotherMessage='das ist,' + ${message} + 'ist'" th:text="${anotherMessage}">Text</div>

Das Ausgabeergebnis davon ist

<div>Dies ist eine Nachricht</div>

Definieren Sie mehrere temporäre Variablen

Wenn Sie mehrere temporäre Variablen definieren möchten, verbinden Sie sie mit Kommas. Selbstverständlich ist die Verarbeitung und Berechnung von Zeichenfolgen auch dann möglich, wenn mehrere Definitionen beschrieben werden.

<div th:with="i=3, anotherMessage=${message} + 'ist'">
	<span th:text="${anotherMessage}">Text</span>
	<span th:text="${i}">Text</span>
</div>

Das Ausgabeergebnis davon ist

<div>
	<span>Ist eine Nachricht</span>
	<span>3</span>
</div>

Definieren Sie denselben Variablennamen

Was ist, wenn ich sie unter demselben Variablennamen speichere?

<div th:with="message=${message} + 'ist'">
	<span th:text="${message}">Text 1</span>
</div>
<div th:text="${message}">Text 2</div>

In diesem Fall wird die ** Nachrichtenzuweisung nur innerhalb des ** th: with-Elements durchgeführt.

<div>
	<span>Ist eine Nachricht</span>
</div>
<div>Botschaft</div>

Der vorübergehend in th: with von Thymeleaf definierte Wert ist ** nur für dieses Element und seine untergeordneten Elemente ** gültig. Andererseits behält JSP + JSTL den gespeicherten Inhalt und den gleichen Inhalt bis zur Ausgabe von Text 2 bei. Das ist ein großer Unterschied. Daher wird in JSP der Wert mit <c: remove> gelöscht und die nachfolgende Verarbeitung fortgesetzt.

Verwenden Sie temporäre Variablen in Thymeleaf in Kombination mit nachfolgenden Attributen wie bedingter Verzweigung und Schleifenverarbeitung wie th: if und th: each.

Untergeordnetes Element ausgeben und nachfolgendes Thymeleaf-Attribut verarbeiten, wenn th: Wenn die Bedingung erfüllt ist

Geben Sie den Inhalt des untergeordneten Elements aus oder führen Sie das Tag des untergeordneten Elements nur aus, wenn bestimmte Bedingungen erfüllt sind. Dies ist dasselbe für JSP / JSTL und Thymeleaf, aber Thymeleaf gibt die Elemente aus, die th: if definieren. Außerdem wird das Thymeleaf-Attribut (th: 〇〇) im selben Element ausgeführt.

Sie können fast dieselbe Methode und Methode zum Schreiben von bedingten Ausdrücken in Attributwerten verwenden.

Grundsystem des bedingten Ausdrucks

An Thymeleaf Name: Nachricht, Wert: Wenn als Nachricht übergeben

<div th:if="${message == 'Botschaft'}">
	<span th:text="${message}">Text</span>
</div>

Dieses Ausgabeergebnis ist

<div>
	<span>Botschaft</span>
</div>

Verwenden Sie Java-Code für bedingte Ausdrücke

Im bedingten Ausdruck von th: if können verschiedene Java-Codes geschrieben werden. Am häufigsten wird eine Methode der Java-Klasse aufgerufen, und es ist auch möglich, sie in einen bedingten Ausdruck zu integrieren oder einen Nur-Anzeige-Wert auszugeben.

<div th:if="${message.startsWith('Messe')}">
	<span th:text="${message}">Text</span>
</div>

Da es sich bei der variablen Nachricht um eine Nachricht mit String handelt, ist startWith () true, daher ist dieses Ausgabeergebnis

<div>
	<span>Botschaft</span>
</div>

Es wird sein.

Für die Ausgabe, wenn die Bedingung beispielsweise nicht erfüllt ist, bestimmt das Folgende, ob die Länge der Zeichenfolge der variablen Nachricht 256 oder mehr beträgt.

<div th:if="${message.length() >= 256}">
	<span th:text="${message}">Text</span>
</div>

Wenn die Bedingung dieser if-Anweisung nicht erfüllt ist, werden das Element und die untergeordneten Elemente nicht vollständig ausgegeben. Mit anderen Worten, dieses

<div th:switch="${message}">
	<span th:case="Botschaft" th:text="${message}"></span>
	<span th:case="*">Es gab keine entsprechende Nachricht</span>
</div>

<div>
	<span>Botschaft</span>
	
</div>

<div>
	
	<span>Es gab keine entsprechende Nachricht</span>
</div>

<div th:switch="${price}">
	<span th:case="100" th:text="${price}">Preis</span>
	<span th:case="200" th:text="${price}">Preis</span>
	<span th:case="300" th:text="${price}">Preis</span>
	<span th:case="*" th:text="Es gibt keinen anwendbaren Preis"></span>
</div>

<div>

	<span>200</spam>


</div>

<div>



	<span>Es gibt keinen anwendbaren Preis</spam>
</div>

public enum Direction {
	North, South, East , West ;

	public String getValue() {
		return name();
	}
}

<div th:switch="${direction.getValue()}">
	<span th:case="North" th:text="Norden"></span>
	<span th:case="East" th:text="Osten"></span>
	<span th:case="South" th:text="Süden"></span>
	<span th:case="West" th:text="Westen"></span>
	<span th:case="*" th:text="Unzutreffend"></span>
</div>

<select>
  <c:forEach var="result" items="${list}">
    <option value="<c:out value="${result.value}" />"><c:out value="${result.label}" /></option>
  </c:forEach>
</select>

<select>
  <option th:each="result : ${list}" th:value="${result.value}" th:inline="text">[[${result.label}]]</option>
</select>