@GetMapping("/layoutExtend")
public String layoutExtend(){
return "template/layoutExtend/layoutExtendMain";
}
<!DOCTYPE html>
<html th:replace="~{template/layoutExtend/layoutFile :: layout(~{::title},~{::section})}"
xmlns:th="http://www.thymeleaf.org">
<head>
<title>메인 페이지 타이틀</title>
</head>
<body>
<section>
<p>메인 페이지 컨텐츠</p>
<div>메인 페이지 포함 내용</div>
</section>
</body>
</html>
아예 html에 replace 해놨다.
<!DOCTYPE html>
<html th:fragment="layout (title, content)" xmlns:th="http://www.thymeleaf.org">
<head>
<title th:replace="${title}">레이아웃 타이틀</title>
</head>
<body>
<h1>레이아웃 H1</h1>
<div th:replace="${content}">
<p>레이아웃 컨텐츠</p>
</div>
<footer>
레이아웃 푸터
</footer>
</body>
</html>
레이아웃 템플릿에서 인자로 받아 특정 부분을 대체시킨다.
이건 뭐냐면 비슷한 형태의 웹페이지가 있을 때 특정 부분들은 양식을 지키면서
다른 콘텐츠나 이런 것들만 인자로 줘서 바꾸는 거다.
기본 틀이 있고 거기에 내가 필요한 부분만 태그로 구현해 놓은다음에 그것 부분만 인자로 넘기는. 물론 레이아웃에서도 그게 어디쪽으로 들어갈 지 구현을 해 놔야지.
뭐 조각이냐, 레이아웃이냐, 레이아웃 확장이냐 이렇게 해놓긴 해 놨는데
내가보기에는 똑같은 기능 훨씬 더 큰 범위로 확장시켰을 뿐인걸로 보임. 리터럴값, 태그, 아예 문서 전체에서 특정 태그만 순으로.
단, 태그 넘길때는 ~{::태그명} 이것도 어떤 조각을 넘긴다 그런 느낌인가 봄. 그냥 리터럴 넘길때는 그냥 쓰면 됨.. 리터럴을 쓴다던지, ${key}로 넘긴다던지..
근데 id나 class로 보내는 건 권장되는 방법이 아니라고 함. 그런 문법도 없는 듯.
장점은 예를 들어 공통적인 footer 부분을 바꿔야 할 때, 만약 이렇게 컴포넌트화? 레이아웃화 안해놓으면 그 웹페이지들을 모두 바꿔야 하지만 이건 한번만 바꾸면 다 바뀜.
'스프링 > 4. 스프링 MVC-2' 카테고리의 다른 글
18. 스프링 타임리프 폼 (0) | 2023.08.26 |
---|---|
17. 스프링이 타임리프에 대해 제공하는 기능들. (0) | 2023.08.26 |
15. 템플릿 레이아웃 (0) | 2023.08.25 |
14. 템플릿 조각 (0) | 2023.08.24 |
13. 타임리프 상에서 자바스크립트 사용 (0) | 2023.08.24 |