2021-08-28
switch 구문은 th내부에서도 바로 사용할 수 있다. th:switch를 선언한 상위 태그 안에 하위 태그마다 th:case의 조건을 넣어두어 각 조건에 맞는 개발자가 원하는 내용을 넣을 수 있다. 바로 예제를 살펴보도록 하자.
-소스코드
유저라는 하나의 DTO or VO(객체)가 있다고 예를 들어보자 해당 객체에는 gender라는 필드 값이 있고 이 안에는 M(남자) 또는 W(여자)라는 하나의 문자만을 가지도록 제한되어 있다고 가정하자. 사용자 입장에서는 단순 문자를 바로 보여주는 것보다. 한글로 표현해주는게 조금 더 가독성이 높기 때문에 치환을 시켜주는 게 좋을 것이다. 이럴 때 타임리프의 switch를 사용하는 것이 좋다. 아래를 보자.
<div th:switch="${user.gender}">
<span th:case="M">남자</span>
<span th:case="W">여자</span>
</div>
상위 태그 div 안에 th:switch 사용하여 user의 gender 필드 값을 저장한다. 이후 하위 태그에서 switch의 값을 th:case에서 체크하고 이중 일치하는 case에 할당된 텍스트를 보여주는 방식이다.
th:switch의 값이 M이라면 남자가 들어간 span 태그가 보여질 것이며, W 라면 여자가 들어간 span 태그만 element에 표시되게 된다.
메인 이미지 출처 : Photo by Kristaps Ungurs on Unsplash