先生と生徒の会話形式で理解しよう

生徒

「Thymeleafで複数の条件分岐をしたい場合、どんな書き方がありますか？」

先生

「Thymeleafではth:switchとth:caseを使うと、複数の条件分岐を簡単に書くことができます。」

生徒

「なるほど！th:caseの具体的な使い方を教えてください。」

先生

「それでは、Thymeleafの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の基本的な使い方

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の注意点とベストプラクティス

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

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

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

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と他の条件分岐との使い分け

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

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

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

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ページを構築できます。