티스토리 뷰

반응형

타임리프에서 리터럴을 사용하는 방법을 살펴보고자 한다

Literal(리터럴)이란 소스 코드상에서 고정된 값을 말하는데

단순하게 "Spring" , 10 , 20 이렇게 고정된 값들이 바로 리터럴이다

String spring = "Spring!"
int age = 10

 

Literal

타임리프는 다음과 같은 리터럴을 제공한다

• 문자 : 'thymeleaf'

• 숫자 : 100

• 불린 : true, false

• null: null

 

굉장히 간단하지만 여기서 꼭 주의해야 하는 점이 하나 있는데 바로 문자 리터럴을 사용할 때의 경우다

타임리프에서는 문자 리터럴을 항상 ' 작은 따옴표로 감싸줘야 한다

<span th:text="'spring'">text</span>

하지만 원칙상 감싸야 하는 것이지, 매번 이렇게 작은따옴표로 문자 리터럴을 감싸기에는 매우 번거롭다

그래서 타임리프의 경우 문자열이 공백없이 이어질 경우 하나의 토큰으로 인지하여 작은따옴표를 생략할 수 있다

<span th:text="spring">text</span>

여기서 주의해야 할 점은 공백없이 이어져야 한다는 것이다

만약 아래와 같이 글자 사이에 공백이 있다면 타임리프가 하나의 토큰으로 인지하지 못하기 때문에 에러가 발생한다

<span th:text="spring thymeleaf">text</span> //spring 과 thymeleaf 사이에 공백이 있다

이때 작은따옴표로 감싸면 정상적으로 작동한다

<span th:text="'spring thymeleaf'">text</span> //spring 과 thymeleaf 사이에 공백이 있지만 정상작동

이 외에도 변수와 함께 사용할 수 있다

<span th:text="'spring' + ${variable}">text</span>

이렇게 변수와 함께 사용할 때 혹은 그냥 문자 리터럴을 사용할 때도 타임리프가 제공하는 더욱 편리한 방법이 있는데

바로 리터럴 대체 문법이다

 

Literal Substitions

매번 작은따옴표로 감싸서 더하기를 하는 것도 번거롭다, 이때 아래와 같이 리터럴 대체 문법을 사용하면 작은따옴표도 더하기도 필요 없이 대체 문법 안에 있는 리터럴과 변수들을 편리하게 사용할 수 있다

//리터럴 대체 문법
<span th:text="|welcome!, ${user.name}!|">text</span>

//변수 + 리터럴 대체 문법
<span th:text="|welcome to ${page.name}| + ' ' +${user.name}">text</span>

 

더보기

개인 학습을 위해 작성되는 글입니다.

제가 잘못 알고 있는 점에 대한 지적 / 더 나은 방향에 대한 댓글을 환영합니다.

 

참조 링크:

https://www.inflearn.com/course/%EC%8A%A4%ED%94%84%EB%A7%81-mvc-2/dashboard

https://www.thymeleaf.org/doc/tutorials/3.0/usingthymeleaf.html

 

반응형
댓글