Spring-BootはThymeleafを統合します

SpringBootはjspの使用を推奨していませんが、他のいくつかのテンプレートエンジンテクノロジーをサポートしています。公式の推奨事項はThymeleafを使用することです。

Thymeleaf

Thymeleafは、VelocityやFreeMarkerに似たテンプレートエンジンであり、JSPを完全に置き換えることができます。他のテンプレートエンジンと比較すると、次の4つの非常に魅力的な機能があります。

動的環境と静的環境の組み合わせ：Thymeleafは、ネットワーク環境と非ネットワーク環境の両方で実行できます。つまり、アーティストはブラウザでページの静的効果を表示でき、プログラマーはサーバー上のデータを使用して動的ページ効果を表示できます。これは、htmlプロトタイプをサポートし、htmlタグに属性を追加して、テンプレートとデータの表示を実現するためです。ブラウザはhtmlを解釈するときに未定義のタグ属性を無視するため、thymeleafテンプレートを静的に実行できます。データがページに返されると、Thymeleafタグが静的コンテンツを動的に置き換えて、ページを動的に表示します。
箱から出して：標準と春の標準の2つの方言を提供し、テンプレートを直接適用してJSTLとOGNLの表現効果を実現し、テンプレートの設定、jstlの変更、タグの毎日の変更の手間を省きます。同時に、開発者はカスタムダイアレクトを拡張および作成することもできます。
マルチダイアレクトのサポート：Thymeleafは、Spring標準ダイアレクトと、SpringMVCと完全に統合されたオプションのモジュールを提供します。これにより、フォームバインディング、属性エディター、国際化、およびその他の機能をすばやく実装できます。
SpringBootと完全に統合されたSpringBootは、Thymeleafのデフォルト構成を提供し、Thymeleafのビューリゾルバーを設定します。jspを使用する前と同じようにThymeleafを操作できます。コードにほとんど違いはありません。つまり、テンプレートの構文に違いがあります。

ケースを使用してThymeleafを統合しましょう

コントローラを書く

コントローラを作成し、ユーザーデータを返し、それをモデルに配置して、将来的にページにレンダリングします

import com.sunyuqi.domain.User;
import com.sunyuqi.mapper.UserMapper;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.GetMapping;

import java.util.List;

@Controller
public class MybatisController {
    
    

    @Autowired
    private UserMapper userMapper;

    @GetMapping("/query")
    public String queryUserList(Model model){
    
    
        List<User> users = userMapper.queryUserList();
        model.addAttribute("users",users);
        return "index";
    }
}

ランチャーのご紹介

ランチャーを直接紹介します。

<dependency>
    <groupId>org.springframework.boot</groupId>
    <artifactId>spring-boot-starter-thymeleaf</artifactId>
</dependency>

SpringBootは、Thymeleafのビューリゾルバーを自動的に登録します

JSPを解析するInternalViewResolverと同様に、Thymeleafもプレフィックスとサフィックスに基づいてテンプレートファイルの場所を決定します。
ここに写真の説明を挿入

デフォルトのプレフィックス：classpath:/templates/
デフォルトのサフィックス：.html

静的ページ

上記のドキュメントによると、テンプレートはデフォルトでクラスパスの下のテンプレートフォルダに配置され、そこに新しいhtmlファイルが作成されます。
ここに写真の説明を挿入

モデル内のデータをレンダリングするためのhtmlテンプレートを作成します。

<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>首页</title>
    <style type="text/css">
        table {
     
     border-collapse: collapse; font-size: 14px; width: 80%; margin: auto}
        table, th, td {
     
     border: 1px solid darkslategray;padding: 10px}
    </style>
</head>
<body>
<div style="text-align: center">
    <span style="color: darkslategray; font-size: 30px">欢迎光临！</span>
    <hr/>
    <table class="list">
        <tr>
            <th>id</th>
            <th>姓名</th>
            <th>年龄</th>
            <th>性别</th>
        </tr>
        <tr th:each="user : ${users}">
            <td th:text="${user.id}">1</td>
            <td th:text="${user.name}"></td>
            <td th:text="${user.age}"></td>
            <td th:text="${user.sex}"></td>
        </tr>
    </table>
</div>
</body>
</html>

htmlの名前を次のように変更することに注意してください：xmlns:th="http://www.thymeleaf.org"構文プロンプトが表示されます

Thymeleaf構文：

$ {} `：これはel式に似ていますが、実際にはognlの構文であり、el式よりも強力です。
th-手順：th-Html5のカスタム属性を使用して実現されます。H5でない場合は、data-th-代わりに使用できます
- th:each：c:foreachコレクションのトラバースに似ていますが、構文がより簡潔です
- th:text：宣言ラベルのテキスト
  - たとえば<td th-text='${user.id}'>1</td>、user.idに値がある場合、デフォルトの1を上書きします。
  - 値がない場合、tdのデフォルトの1が表示されます。これが、thymeleafが動的と静的を組み合わせることができる理由です。テンプレートの解析に失敗しても、デフォルト値が表示されるため、ページの表示効果には影響しません。

テンプレートキャッシュ

Thymeleafは、テンプレートを初めて解析した後にテンプレートをキャッシュします。これにより、同時処理機能が大幅に向上します。

キャッシュをオフにするには設定が必要

spring.thymeleaf.cache=false