블록(block)

대부분의 타임리프 기능은 html 태그가 가진 속성을 쉽게 활용할 수 있도록 되어있지만, block은 html에 없는 타임리프가 가진 유일한 기능이다. 대표적인 예시로는 아래와 같다.

예제

<th:block th:each="user : ${users}">
 	<div>
 		이름: <span th:text="${user.username}"></span>
 		나이: <span th:text="${user.age}"></span>
 	</div>
 	<div>
 		비고: <span th:text="${user.username} + ' / ' + ${user.age}"></span>
 	</div>
</th:block>

• 코드를 보면 th:each 를 통해 컬렉션 반복문을 진행한다.
• 원래라면 아래 두 가지 방식으로 태그를 활용해야 이름,나이 그리고 비고가 반복된다.
  1. 이름, 나이가 있는 div 태그에 반복을 th:each를 쓰고, 비고가 있는 div 태그에 th:each를 다시 쓰기.

 <div th:each="user : ${users}"> // 반복문
 	이름: <span th:text="${user.username}"></span>
 	나이: <span th:text="${user.age}"></span>
</div>
<div th:each="user : ${users}"> // 반복문
 	비고: <span th:text="${user.username} + ' / ' + ${user.age}"></span>
</div>

2. 이름과 나이가 있는 div 태그와 비고가 있는 div 태그를 새로운 div 태그로 감싸주고 거기에 th:each를 쓰기

<div th:each="user : ${users}"> // 반복문
 	<div>
 		이름: <span th:text="${user.username}"></span>
 		나이: <span th:text="${user.age}"></span>
 	</div>
 	<div>
 		비고: <span th:text="${user.username} + ' / ' + ${user.age}"></span>
 	</div>
</div>

• 하지만, 위의 두 가지 방식대로 작성한다면 반복문을 두 번 사용하거나, 불필요한 태그가 생겨 가독성이 떨어지게 된다. 따라서 타임리프가 th:block 기능을 제공하는 것.
• th:block 의 경우, 렌더링 후 사라지기 때문에 태그를 보기에도 깔끔하며, 반복문이 중복되는 문제를 한 번에 해결해준다. th:block 로 감싸진 내부는 하나의 태그로 묶인 것처럼 작동되기 때문이다.