SpringBoot+Thymeleaf は HTML5 の最新のテンプレート エンジン方式に基づいています

はじめに

1.依存関係の導入

SpringBoot はデフォルトで Thymeleaf の Starter を提供しますが、単に依存関係を導入するだけです。

<dependency>
      <groupid>org.springframework.boot</groupid>
      <artifactid>spring-boot-starter-thymeleaf</artifactid>
    </dependency>

現在のデフォルト バージョンは 2.1 です。バージョンを 3.0 にアップグレードしたい場合は、次のように変更できます。

  <properties>
    <thymeleaf.version>3.0.7.RELEASE</thymeleaf.version>
    <thymeleaf-layout-dialect.version>2.0.0</thymeleaf-layout-dialect.version>
  </properties>

開発を容易にするために、プロジェクト ケースではホット デプロイメント ツール dev-tools を使用しています。これにより、ページを変更した後、IDEA が自動的に読み込まれ、ホット アップデートの効果が得られます。

   <dependency>
      <groupid>org.springframework.boot</groupid>
      <artifactid>spring-boot-devtools</artifactid>
      <scope>runtime</scope>
    </dependency>

注: IDEA はデフォルトでホット デプロイメントを無効にするため、有効にするためにいくつかの設定を行う必要があります。解決策: まず Ctrl Shift Alt を押したままレジストリに入り、compiler.automake.allow.when.app.running を確認します。さらに、[ビルド] -> [コンパイラ] も自動的に [プロジェクトのビルド] をチェックする必要があります。

2. 関連する構成を追加します

Thymeleaf では、デフォルトでページ キャッシュが有効になっています。開発中はキャッシュをオフにする必要があります。さらに、通常はページの保存パスも指定します。 (デフォルトは classpath:/templates/)

application.yml 配置如下：
spring:
 thymeleaf:
  cache: false #关闭缓存
  prefix: classpath:/views/ #添加路径前缀

3. HTML

Thymeleaf の作成は、HTML5 ページの作成と何ら変わりません。最大の変更点は、拡張属性 (th:xx) を使用してサーバーとデータをやり取りし、元のページ スタイルを保持します。これは、Thymeleaf が推奨するスタイルでもあります。たとえば、次の単純なケースでは、プロジェクトを開始した後、ページが Jianshu のリンクにジャンプすることがわかり、ネイティブ ページ データをカバーする Thymeleaf の優れた能力も検証されました。

ページ コード:

nbsp;html>


  <title>Thymeleaf</title>


  <h3 id="欢迎使用Thymeleaf">欢迎使用Thymeleaf!!</h3>
  <a>戳我有惊喜</a>

バックエンド コード:

@Controller
public class UserController {

  @GetMapping("/")
  public String index(Model model) {
    model.addAttribute("info", "user/list");
    return "index";
  }

  @GetMapping("/user")
  public String hehe(Model model) {
    model.addAttribute("user", new User(UUID.randomUUID().toString(), "yizhiwazi", "20170928"));
    return "user";
  }

  @GetMapping("/user/list")
  public String userlist(Model model) {
    List<user> userList = new ArrayList();
    userList.add(new User(UUID.randomUUID().toString(), "yizhiwazi", "20170928"));
    userList.add(new User(UUID.randomUUID().toString(), "kumamon", "123456"));
    userList.add(new User(UUID.randomUUID().toString(), "admin", "admin"));
    model.addAttribute("userList", userList);
    return "userList";
  }

}</user>

次に、単一のユーザー情報を表示するためにフォームをバックフィルしてみます。

<!-- 使用th:object 搭配*{} 可以省略对象名 -->

        

次に、ユーザー リスト情報の表示など、より複雑なケースに入ります。新しいタグを記述せずにユーザーのバッチの走査を完了できます。

rree

以上がSpringBoot+Thymeleaf は HTML5 の最新のテンプレート エンジン方式に基づいていますの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。