th: include ist seit thymeleaf 3.0 veraltet. Sie haben in den Kommentaren darauf hingewiesen. Vielen Dank. Es gibt keine Beschreibung, die zu diesem Zeitpunkt abgeschafft wird, aber es scheint besser, th: include nicht zu verwenden.
Lass uns Spring machen, ein Java-Framework! In diesem Fall ist Thymeleaf die am häufigsten verwendete Ansichtsvorlage.
Mit diesem Thymeleaf können Sie auch eine Vorlagendatei für jedes Teil erstellen und mit th: include, th: replace oder th: insert laden. Als ich es zum ersten Mal benutzte, war th: include? Th: replace? Th: insert? Welches soll ich verwenden? Da es so etwas war, werde ich es zusammenfassen.
Angenommen, Sie haben die folgende Teilansicht
part.html
<div id="children">
part
</div>
Im Falle von include wird es als kleines Element hinzugefügt
include.html
<div id="parent" th:include="part">text</div>
<!--Ergebnis-->
<div id="parent">
<div id="children">
part
</div>
</div>
Beim Ersetzen werden die Elemente ersetzt
replace.html
<div id="parent" th:replace="part">text</div>
<!--Ergebnis-->
<div id="children">
part
</div>
Beim Einfügen wird das Element eingefügt. Das Ergebnis entspricht dem Einschließen.
insert.html
<div id="parent" th:insert="part">text</div>
<!--Ergebnis-->
<div id="parent">
<div id="children">
part
</div>
</div>
Es gibt die folgenden Methoden, um die Vorlage anzugeben
templateName ist der Pfad aus den Vorlagenverzeichnissen. Im folgenden Fall handelt es sich um "Komponenten / Teil".
templates
└── components
└── part.html
Sie können auch this :: fragmentName
oder :: fragmentName
angeben, wobei dies auf Ihre eigene Vorlage verweist.
Definitionsbeispiel
fragment.html
<div id="fragment1" th:fragment="template1()">
<span>template1</span>
</div>
<div id="fragment2" th:fragment="template2(text)">
Sie können auch Argumente übergeben
<span th:text="${text}"></span>
</div>
Die Operation war wie folgt zum Lesen ohne Verwendung des obigen Fragments. Es gibt keinen Unterschied zwischen th: include und th: insert.
--th: include-> Füge das geladene HTML zum Unterelement hinzu --th: replace-> Das Element wird durch das geladene HTML ersetzt --th: insert-> Füge das geladene HTML zum Unterelement hinzu
Seien Sie vorsichtig, wenn Sie Fragmente verwenden. Das zu verwendende Fragment ist das obige Definitionsbeispiel.
include.html
<div id="include" th:include="fragment::template1()">
<span>text</span>
</div>
<!--Ergebnis-->
<div id="include">
<span>template1</span>
</div>
Das Innere des Fragmentes wird übergeben. Elemente wie id wenn th: enthalten bleiben. Daher können Sie es wie folgt verwenden.
<div th:if=${isDisplay} th:include="fragment::template1()"></div>
Es ist natürlicher, die Teile selbst mit der Vorlage auf der übergeordneten Seite anzuzeigen. Die anzuwendende Klasse wird ebenfalls angezeigt. Wenn Sie sie also ordnungsgemäß verwenden, können Sie sie ordnungsgemäß als Komponente wiederverwenden.
replace.html
<div id="replace" th:replace="fragment::template1()"></div>
<!--Ergebnis-->
<div id="fragment1">
<span>template1</span>
</div>
Der zu beachtende Punkt ist, dass er die Stelle ersetzt, an der das Fragment definiert ist. Die ID und, falls auf der Seite th: replace definiert, werden nicht bestimmt.
insert.html
<div id="insert" th:insert="fragment::template1()"></div>
<!--Ergebnis-->
<div id="insert">
<div id="fragment1">
<span>template1</span>
</div>
</div>
Das Element th: fragment wird eingefügt. Wie bei th: include bleibt id erhalten, so dass th: if usw. verwendet werden kann.
Wenn th: fragment verwendet wird, unterscheidet sich das Ausgabeergebnis zwischen th: include und th: replace oder th: insert. Wenn Sie Elemente wie class und th: verwenden möchten, ist es auf der übergeordneten Seite einfacher, th: insert zu verwenden. th: include ist seit 3.0 veraltet. Wie Sie daraus sehen können, liegt es daran, dass es schwierig ist, das Verhalten bei der Verwendung von Fragmenten zu verstehen?
Es kann beim Erstellen einer gemeinsamen Vorlage verwendet werden.
fragment.html
<head th:fragment="head(link, script)">
<meta content="text/html; charset=UTF-8"/>
<link href="common-link"/>
<script src="common-src"/>
<th:block th:if="${link != null}" th:include="${link}"></th:block>
<th:block th:if="${script != null}" th:include="${script}"></th:block>
</head>
<!--Benutzerseite-->
<html>
<head th:replace="fragment::head(~{head/link}, ~{head/sccript})">
<link href="xxx"/>
<link href="yyy"/>
<script src="xxx"/>
<script src="yyy"/>
</head>
<body>
content
</body>
</html>
<!--Ergebnis-->
<html>
<head>
<meta content="text/html; charset=UTF-8"/>
<link href="common-link"/>
<script src="common-src"/>
<link href="xxx"/>
<link href="yyy"/>
<script src="xxx"/>
<script src="yyy"/>
</head>
<body>
content
</body>
</html>
~ {}
ist eine Beschreibungsmethode, die als Fragmentausdruck bezeichnet wird. Sie können den eigentlichen Tag-Inhalt als Argument übergeben, indem Sie ~ {}
verwenden.
Da der Teil, der th: replace verwendet, das Head-Tag ist, können Sie visuell sehen, dass der Inhalt des Head-Tags an das Argument fragment übergeben wird.
Wir verwenden auch th: replace, um das Fragment-Tag auf head zu setzen. Selbst wenn ein Fremder es sieht, frage ich mich, ob ich den Inhalt des Head-Tags schreiben soll.
Wenn es eingeschlossen ist, kann das Fragment-Tag alles sein, so dass es nicht nötig ist zu sagen, dass sich das Meta-Tag im div befindet .... Da es sich in erster Linie um eine HTML-Datei handelt, sollte sie die richtige Grammatik als HTML haben, ohne das Blatt zu interpretieren.
Durch die Verwendung von th: block sollte der Anwendungsbereich meiner Meinung nach derselbe sein.
<th:block th:fragment="template()">
<div>
<span>template</span>
</div>
</th:block>
https://www.thymeleaf.org/doc/tutorials/3.0/usingthymeleaf_ja.html