Thymeleaf é um mecanismo de modelo para renderizar conteúdo XML/XHTML/HTML5. É semelhante a mecanismos de modelo, como JSP, Velocity, FreeMaker, etc., e também pode ser facilmente integrado a estruturas da Web, como Spring MVC. Em comparação com outros mecanismos de modelo, o maior recurso do Thymeleaf é que, mesmo que o aplicativo da Web não seja iniciado, a página do modelo pode ser aberta diretamente no navegador e exibida corretamente.
- Introdução ao Thymeleaf
Thymeleaf é uma nova geração de mecanismo de modelo Java. Ao contrário dos mecanismos de modelo Java tradicionais, como Velocity e FreeMarker, o Thymeleaf suporta protótipos HTML e seu sufixo de arquivo é ".html", para que possa ser aberto diretamente pelo navegador , e o navegador irá ignorá-lo neste momento. Atributos de tag Thymeleaf indefinidos, mostrando o efeito de página estática do modelo thymeleaf; quando acessado por meio de um aplicativo da web, Thymeleaf substituirá dinamicamente o conteúdo estático para tornar a página exibida dinamicamente.
Thymeleaf atinge o modo de exibição de "modelo + dados" adicionando atributos adicionais na tag html, o código de amostra é o seguinte.
Bem-vindo à página estática HTML
Quando aberto diretamente com um navegador, o navegador exibe os resultados da seguinte forma.
Bem-vindo à página estática HTML
Quando acessado por meio do aplicativo da Web, o navegador exibe os resultados da seguinte forma.
Bem-vindo ao Thymeleaf
Recursos do Thymeleaf
O mecanismo de modelo do Thymeleaf possui os seguintes recursos:
Combinação de dinâmico e estático: O Thymeleaf pode ser aberto diretamente com um navegador para visualizar o efeito estático da página ou acessado por meio de um aplicativo da Web para visualizar o efeito dinâmico da página.
Pronto para uso: o Thymeleaf fornece o dialeto padrão do Spring e um módulo opcional perfeitamente integrado ao SpringMVC, que pode implementar rapidamente funções como vinculação de formulários, editor de propriedades e internacionalização.
Suporte a vários dialetos: fornece dois dialetos padrão Thymeleaf e padrão Spring, que podem aplicar modelos diretamente para implementar expressões JSTL e OGNL; os desenvolvedores também podem expandir e criar dialetos personalizados quando necessário.
Integração perfeita com o SpringBoot: O SpringBoot fornece uma configuração padrão para o Thymeleaf e também define um resolvedor de visualização para o Thymeleaf, para que o Thymeleaf possa ser perfeitamente integrado ao Spring Boot.
2. Regras de sintaxe do Thymeleaf
Antes de usar o Thymeleaf, primeiro declare o namespace na tag html da página, o exemplo de código é o seguinte.
xmlns:th="http://www.thymeleaf.org"
Declare este namespace na tag html para evitar erros de validação html no editor, mas este passo não é necessário, mesmo que não declaremos o namespace Não afeta o uso da folha de tomilho.
Como um mecanismo de modelo, o Thymeleaf tem suas próprias regras gramaticais. A sintaxe do Thymeleaf é dividida nas 2 categorias a seguir:
Sintaxe de expressão padrão
th attribute
2.1 Sintaxe de expressão padrão
O mecanismo de modelo Thymeleaf suporta uma variedade de expressões:
Expressão de variável: ${…}
Expressão de variável de seleção: *{…}
Expressão de link: @{…}
Expressão de internacionalização: #{…}
Expressão de referência de fragmento: ~{…}
2.1.1
Uso de expressão de variável A expressão agrupada por ${} é chamada de expressão variável, que tem as seguintes funções:
Obter propriedades e métodos de um objeto
Usar objetos primitivos embutidos
Usar objetos utilitários embutidos
① Obtenha as propriedades e métodos do objeto
As propriedades e métodos dos objetos podem ser obtidos usando expressões variáveis. Por exemplo, para obter a propriedade lastName de um objeto pessoa, a forma da expressão é a seguinte:
${pessoa.últimoNome}
② Use objetos básicos embutidos
Usando expressões variáveis, você também pode usar objetos básicos integrados, obter propriedades de objetos integrados e chamar métodos de objetos integrados. Os objetos básicos embutidos comumente usados no Thymeleaf são os seguintes:
#ctx : objeto de contexto;
#vars : variável de contexto;
#locale: localidade de contexto;
#request: objeto HttpServletRequest (disponível apenas em aplicativos da web);
#response: objeto HttpServletResponse (disponível apenas em aplicativos da web);
#session : objeto HttpSession ( disponível apenas em aplicações Web);
#servletContext: objeto ServletContext (disponível apenas em aplicações Web).
Por exemplo, podemos obter o atributo map no objeto de sessão através das duas formas a seguir:
${#session.getAttribute('map')}
${session.map}
③ Use objetos de ferramentas integrados
Além de poder usar objetos básicos integrados, as expressões variáveis também podem usar alguns objetos utilitários integrados.
strings: objeto de ferramenta String, métodos comumente usados são: equals, equalsIgnoreCase, length, trim, toUpperCase, toLowerCase, indexOf, substring, replace, startsWith, endsWith, contains e containsIgnoreCase, etc.; números: objeto de ferramenta Number, métodos comumente usados são :
formatDecimal etc.;
bools: objeto de ferramenta booleana, métodos comumente usados são: isTrue e isFalse, etc.;
arrays: objeto de ferramenta de array, métodos comumente usados são: toArray, length, isEmpty, contains e containsAll, etc.;
listas/conjuntos : Objeto de ferramenta de coleção List/Set, os métodos comumente usados são: toList, size, isEmpty, contains, containsAll e sort, etc.;
maps: Objeto de ferramenta de coleção de mapas, os métodos comumente usados são: size, isEmpty, containsKey e containsValue, etc. ; datas
: objeto de ferramenta de data, os métodos comumente usados são: formato, ano, mês, hora, createNow, etc.
Por exemplo, podemos usar o método equals das strings de objeto de ferramenta interna para determinar se uma string é igual a uma propriedade de um objeto, o código é o seguinte.
${#strings.equals('Programming Help',name)}
2.1.2 Selecionar expressão variável
Selecionar expressão variável é basicamente a mesma função que expressão variável, exceto que a cooperação com th:object é adicionada com base no uso da expressão variável . Depois de usar th:object para armazenar um objeto, podemos usar a expressão de variável de seleção ({…}) em seus descendentes para obter as propriedades no objeto, onde " " representa o objeto.
primeiro nome
2.1.3 Expressão de link
Seja uma referência de recurso estático ou uma solicitação de formulário, qualquer link pode usar uma expressão de link (@{…}).
A estrutura formal da expressão de link é a seguinte:
Solicitação sem referência: @{/xxx}
Solicitação com referência: @{/xxx(k1=v1,k2=v2)}
Por exemplo, use a expressão de link para importar a folha de estilo css, o código é o seguinte.
2.1.4 Expressões internacionalizadas Expressões de mensagem são geralmente usadas em cenários internacionalizados. A estrutura é a seguinte.th:text="#{msg}"
Nota: Apenas entenda aqui, vamos apresentá-lo em detalhes nos próximos capítulos.
2.1.5 Expressão de referência de fragmento
A expressão de referência de fragmento é usada para se referir a outros fragmentos de modelo na página de modelo e a expressão suporta as 2 estruturas de sintaxe a seguir:
Recomendado: ~{templatename::fragmentname}
Compatível: ~{templatename::#id}
A estrutura gramatical acima é explicada da seguinte forma:
templatename: nome do modelo, Thymeleaf resolverá o caminho completo de acordo com o nome do modelo: /resources/templates/templatename.html, preste atenção ao caminho do arquivo.
fragmentname: nome do fragmento, Thymeleaf define blocos de código através da declaração th:fragment, a saber: th:fragment="fragmentname"
id: seletor de id HTML, ao usá-lo, adicione # na frente, seletor de classe não é suportado.
2.2º atributo
Thymeleaf também fornece um grande número de atributos, que podem ser usados diretamente em tags HTML, e os atributos comumente usados e seus exemplos são mostrados na tabela a seguir.
3. Extração de página pública Thymeleaf
Em projetos da web, geralmente existem alguns fragmentos de página pública (códigos duplicados), como a barra de navegação do cabeçalho, a barra de menu lateral e o js css público. Geralmente extraímos esses fragmentos de página pública e os armazenamos em uma página independente e, em seguida, somos referenciados por outras páginas conforme necessário, o que pode eliminar a duplicação de código e tornar a página mais concisa.
3.1 Extraindo páginas públicas
O Thymeleaf, como um mecanismo de modelo elegante e altamente sustentável, também suporta a extração e referência de páginas públicas. Podemos extrair fragmentos de página pública e armazená-los em uma página independente e usar o atributo th:fragment fornecido por Thymeleaf para nomear esses fragmentos de página pública extraídos.
O exemplo 1
extrai o fragmento de página comum e o armazena em commons.html, o código é o seguinte.
O uso dos três atributos acima para introduzir fragmentos de página pode ser obtido das duas maneiras a seguir.
~{templatename::selector}: nome do modelo::selector
~{templatename::fragmentname}: nome do modelo::nome do fragmento
Normalmente, ~{} pode ser omitido e seu método de escrita inline é [[~{…}]] Ou [(~{…})], onde [[~{…}]] escapa caracteres especiais e [(~{…})] não.
Exemplo 2
- A introdução de fragmentos de página declarados em commons.html na página fragment.html pode ser realizada das seguintes maneiras.
- Inicie o Spring Boot, use um navegador para acessar fragment.html e visualize o código-fonte. Os resultados são os seguintes.
Se houver poucos parâmetros de entrada, o segundo método geralmente é usado para passar diretamente o valor do parâmetro para o fragmento da página;
se houver muitos parâmetros, é recomendável usar o primeiro método para especificar claramente o nome e o valor do parâmetro.
O código de exemplo é o seguinte:
...
Inicie o Spring Boot, use um navegador para acessar fragment.html, o resultado é o mostrado abaixo.
Diagrama de efeito de passagem de parâmetro de página Thymeleaf
