프론트엔드

Thymeleaf 정리

한 면만 쓴 종이 2022. 8. 23. 16:44

th:replace

각 화면에 분리해놓은 fragment를 붙여넣을 때 사용

태그 전체를 지정한 fragment로 교체해줌

 

th:insert

th:replace와 유사한 기능

th:replace와의 가장 큰 차이점은 th:insert가 속한 태그 내부에 fragment를 삽입해줌

 

th:action

form 태그와 같이 사용.

지정한 속성값 경로로 요청을 보낼 때 사용

<form th:action="@{/guestbook/register}" th:method="post">

위 코드는 POST 방식으로 전송할 수 있도록 지정

 

Thymeleaf의 링크

'@{ }' 를 이용

 

Thymeleaf의 반복문

th:each = "변수: ${목록} "

 

th:block

HTML의 태그가 아닌 오직 Thymeleaf만이 제공하는 자체 태그 => HTML로 처리X

th:text나 th:value등을 써야하는 다른 태그들과 달리 별도의 태그가 필요 없음

 

반복문 문제 해결을 위해 만든 것이 주된 이유

두 개의 반복문을 같이 돌릴 때, 하나의 반복문이 다 돌고 그 후에 나머지 반복문이 도는 것이 아닌 하나씩 돌도록 해줌

하나의 블록으로 처리하는 방식

 

 

include 방식의 처리

  • th:insert
  • th:replace

📎 th:insert

기존 내용의 바깥쪽 택는 우지하면서 추가되는 방식

 

📎 th:replace

기존의 내용을 완전히 대체하는 방식