th: include est obsolète depuis thymeleaf 3.0. Vous l'avez souligné dans les commentaires. Merci beaucoup. Il n'y a aucune description qui sera abolie pour le moment, mais il semble préférable de ne pas utiliser th: include.
Faisons Spring, qui est un framework java! Si tel est le cas, le modèle de vue le plus couramment utilisé est Thymeleaf.
Cette Thymeleaf vous permet également de créer un fichier modèle pour chaque pièce et de le charger en utilisant th: include, th: replace ou th: insert. Lorsque je l'utilisais pour la première fois, th: include? Th: replace? Th: insert? Que devrais-je utiliser? Puisqu'il s'agissait de quelque chose comme ça, je vais le résumer.
En supposant que vous ayez la vue partielle suivante
part.html
<div id="children">
part
</div>
En cas d'inclusion, il sera ajouté en tant que petit élément
include.html
<div id="parent" th:include="part">text</div>
<!--résultat-->
<div id="parent">
<div id="children">
part
</div>
</div>
En cas de remplacement, les éléments sont remplacés
replace.html
<div id="parent" th:replace="part">text</div>
<!--résultat-->
<div id="children">
part
</div>
Dans le cas de l'insertion, l'élément est inséré. Le résultat est le même que l'inclusion.
insert.html
<div id="parent" th:insert="part">text</div>
<!--résultat-->
<div id="parent">
<div id="children">
part
</div>
</div>
Il existe les méthodes suivantes pour spécifier le modèle
templateName est le chemin des répertoires de modèles. Dans le cas suivant, ce sera «composants / partie».
templates
└── components
└── part.html
Vous pouvez également spécifier this :: fragmentName
ou :: fragmentName
, où cela pointe vers votre propre modèle.
Exemple de définition
fragment.html
<div id="fragment1" th:fragment="template1()">
<span>template1</span>
</div>
<div id="fragment2" th:fragment="template2(text)">
Vous pouvez également passer des arguments
<span th:text="${text}"></span>
</div>
L'opération était la suivante pour la lecture sans utiliser le fragment ci-dessus. Il n'y a aucune différence entre th: include et th: insert.
--th: include-> Ajouter le html chargé au sous-élément --th: replace-> L'élément est remplacé par le html chargé --th: insert-> Ajouter le html chargé au sous-élément
Soyez prudent lorsque vous utilisez des fragments. Le fragment à utiliser est l'exemple de définition ci-dessus.
include.html
<div id="include" th:include="fragment::template1()">
<span>text</span>
</div>
<!--résultat-->
<div id="include">
<span>template1</span>
</div>
L'intérieur de th: fragment est passé. Les éléments tels que id quand th: inclus restent. Par conséquent, vous pouvez l'utiliser comme suit.
<div th:if=${isDisplay} th:include="fragment::template1()"></div>
Il est plus naturel d'afficher les pièces elles-mêmes à l'aide du modèle parent. La classe à appliquer est également reflétée, donc si vous l'utilisez correctement, vous pouvez la réutiliser correctement en tant que composant.
replace.html
<div id="replace" th:replace="fragment::template1()"></div>
<!--résultat-->
<div id="fragment1">
<span>template1</span>
</div>
Le point à noter est qu'il remplace l'endroit où th: fragment est défini. L'identifiant et s'il est défini du côté th: replace ne sont pas déterminés.
insert.html
<div id="insert" th:insert="fragment::template1()"></div>
<!--résultat-->
<div id="insert">
<div id="fragment1">
<span>template1</span>
</div>
</div>
L'élément de th: fragment est inséré. Comme avec th: include, id reste, donc th: if etc. peut être utilisé.
Lorsque th: fragment est utilisé, le résultat de sortie diffère entre th: include et th: replace ou th: insert. Si vous souhaitez utiliser des éléments tels que class et th: if du côté parent, il est plus simple d'utiliser th: insert. th: include est obsolète depuis la version 3.0. Comme vous pouvez le voir, est-ce parce qu'il est difficile de comprendre le comportement lors de l'utilisation de fragment?
Il peut être utilisé lors de la création d'un modèle commun.
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>
<!--Côté utilisateur-->
<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>
<!--résultat-->
<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>
~ {}
est une méthode de description appelée expression de fragment. Vous pouvez passer le contenu réel de la balise comme argument en utilisant ~ {}
.
Puisque la partie utilisant th: replace est la balise head, vous pouvez voir visuellement que le contenu de la balise head est passé à l'argument de fragment.
Il force également la balise fragment à head en utilisant th: replace. Même si un inconnu le voit, je me demande si je devrais écrire le contenu de la balise head.
Avec include, la balise fragment peut être n'importe quoi, il semble donc que vous n'ayez pas à dire "la balise meta est dans le div ...". Puisqu'il s'agit d'un fichier html en premier lieu, il doit avoir la grammaire correcte en html sans interpréter thymeleaf.
En utilisant th: block, je pense que le champ d'application devrait être le même en conséquence.
<th:block th:fragment="template()">
<div>
<span>template</span>
</div>
</th:block>
https://www.thymeleaf.org/doc/tutorials/3.0/usingthymeleaf_ja.html