Thymeleafのth:caseを完全ガイド！初心者でもわかる条件分岐の書き方

1. th:caseとは？

1. th:caseとは？

Thymeleafのth:caseは、th:switchと組み合わせて使用することで、複数の条件に基づいて表示内容を切り替えることができます。これは、Javaのswitch-case文と似た構文で、特定の値に応じて異なるHTML要素を表示する際に便利です。

例えば、ユーザーの役割に応じて表示内容を変える場合、以下のように記述します。

<div th:switch="${user.role}">
    <p th:case="'ADMIN'">管理者ページ</p>
    <p th:case="'USER'">ユーザーページ</p>
    <p th:case="*">ゲストページ</p>
</div>

この例では、user.roleの値が"ADMIN"の場合は「管理者ページ」、"USER"の場合は「ユーザーページ」、それ以外の場合は「ゲストページ」と表示されます。

2. th:caseの基本的な使い方

2. th:caseの基本的な使い方

th:caseは、th:switchで指定した変数の値に応じて、表示内容を切り替えるために使用します。各th:caseには、比較する値を指定します。値が一致した場合、その要素が表示されます。

以下は、商品の在庫状況に応じて表示内容を変える例です。

<div th:switch="${product.stockStatus}">
    <p th:case="'IN_STOCK'">在庫あり</p>
    <p th:case="'OUT_OF_STOCK'">在庫なし</p>
    <p th:case="'DISCONTINUED'">販売終了</p>
    <p th:case="*">情報なし</p>
</div>

このように、th:caseを使うことで、複数の条件に対応した表示が可能になります。

3. th:caseの注意点とベストプラクティス

3. th:caseの注意点とベストプラクティス

th:caseを使用する際の注意点として、以下のポイントがあります。

• 値の一致は厳密に行われる：比較する値は、文字列の場合はシングルクォートで囲む必要があります。
• デフォルトケースの指定：どのth:caseにも一致しない場合の表示内容を指定するには、th:case="*"を使用します。
• 可読性の向上：複数の条件分岐がある場合、th:ifを連続して使用するよりも、th:switchとth:caseを使った方がコードの可読性が向上します。

これらのポイントを押さえることで、th:caseを効果的に活用できます。

4. 実践的な例：ユーザーのステータスに応じた表示

4. 実践的な例：ユーザーのステータスに応じた表示

実際のWebアプリケーションでは、ユーザーのステータスに応じて表示内容を変えることがよくあります。以下は、その一例です。

<div th:switch="${user.status}">
    <p th:case="'ACTIVE'">アクティブユーザー</p>
    <p th:case="'INACTIVE'">非アクティブユーザー</p>
    <p th:case="'BANNED'">利用停止中</p>
    <p th:case="*">ステータス不明</p>
</div>

このように、th:caseを使うことで、ユーザーのステータスに応じた柔軟な表示が可能になります。

5. th:caseと他の条件分岐との使い分け

5. th:caseと他の条件分岐との使い分け

Thymeleafには、th:ifやth:unlessといった条件分岐のための属性もあります。これらとの使い分けについて理解しておくと、より効果的にテンプレートを構築できます。

• th:if：単一の条件を評価し、条件が真の場合に要素を表示します。
• th:unless：th:ifの逆で、条件が偽の場合に要素を表示します。
• th:switch / th:case：一つの変数に対して複数の値を評価し、それぞれに応じた表示を行います。

複数の条件を評価する場合は、th:switchとth:caseを使うと、コードが整理されて可読性が高まります。

6. Javaコードとの連携例

6. Javaコードとの連携例

Thymeleafのテンプレートは、Javaのコントローラーから渡されたデータを元に表示内容を決定します。以下は、ユーザーのステータスをコントローラーで設定し、テンプレートでth:caseを使って表示を切り替える例です。

@Controller
public class UserController {
    @GetMapping("/user")
    public String getUser(Model model) {
        String status = "ACTIVE";
        model.addAttribute("user", new User(status));
        return "user";
    }
}

このように、JavaコードとThymeleafのテンプレートを連携させることで、動的なWebページを構築できます。

まとめ

まとめ

th:caseを使った条件分岐の考え方を振り返る

ここまで、Thymeleafにおけるth:caseの基本から実践的な使い方までを丁寧に確認してきました。th:caseは、th:switchと組み合わせて使用することで、複数の条件分岐を直感的かつ整理された形で記述できる非常に便利な仕組みです。Javaのswitch文に近い感覚で利用できるため、Spring BootやJava開発の経験がある人にとっては理解しやすく、テンプレートの可読性を大きく向上させてくれます。

特に、ユーザーの権限、ステータス、ロール、商品の状態、在庫状況など、決まった値の中から一つを判定するケースでは、th:ifを複数並べるよりもth:switchとth:caseを使った方が、HTML構造がすっきりし、後から見返したときにも意図が伝わりやすくなります。Thymeleafの条件分岐を正しく使い分けることは、保守性の高いテンプレート設計につながります。

デフォルトケースと可読性の重要性

th:caseを使う際に特に重要なのが、th:case="*" を用いたデフォルトケースの存在です。これは、どの条件にも一致しなかった場合の表示を定義するもので、想定外の値が渡された場合でも画面が崩れないようにする安全装置の役割を果たします。実際のWebアプリケーションでは、データの状態が常に完全に制御されているとは限らないため、このデフォルトケースを用意しておくことは非常に重要です。

また、文字列の比較ではシングルクォートで囲む必要がある点や、条件の書き方を統一することで、テンプレート全体の可読性が向上する点も見逃せません。ThymeleafはHTMLに近い書き方ができる一方で、条件分岐が複雑になると読みにくくなりがちです。そのため、th:caseを使って分岐を整理することは、チーム開発や長期運用において大きなメリットになります。

実務を意識したth:caseの活用イメージ

実務では、ユーザー管理画面や管理者画面、ECサイトの商品一覧、ステータス表示など、th:caseが活躍する場面が数多く存在します。たとえば、ログイン中のユーザーが管理者なのか一般ユーザーなのかによって表示するメニューを切り替えたり、注文の状態に応じて表示文言やボタンを変更したりといった処理は、th:caseを使うことで簡潔に表現できます。

Javaのコントローラー側で状態をしっかりと整理し、Thymeleafテンプレートでは表示に専念するという役割分担を意識することで、コード全体の見通しが良くなります。th:caseはその橋渡し役として非常に優秀な存在であり、Spring BootとThymeleafを組み合わせた開発では欠かせない知識の一つと言えるでしょう。

まとめとしてのサンプルプログラム

<div th:switch="${order.status}">
    <p th:case="'NEW'">新規注文です</p>
    <p th:case="'SHIPPED'">発送済みです</p>
    <p th:case="'CANCELLED'">キャンセルされました</p>
    <p th:case="*">注文状況を確認中です</p>
</div>

このように、状態ごとに明確な表示を分けることで、画面の分かりやすさが向上し、ユーザーにとっても親切なUIを実現できます。th:caseを適切に使うことは、単なる構文の理解にとどまらず、ユーザー体験の向上にも直結します。