springboot模板引擎thymeleaf（一）

r囧r小猫 2022-01-14 07:45 345阅读 0赞

很多初学者可能都不知道怎么读，**翻译软件是“ saimu leifu ”，其实是错的**

读音的地址：[https://fanyi.baidu.com/?aldtype=23\#en/zh/thymeleaf][https_fanyi.baidu.com_aldtype_23_en_zh_thymeleaf]

官网中有正确的读音：[https://www.thymeleaf.org/][https_www.thymeleaf.org]

**正确读音：/ˈtaɪmˌlɪːf/**

In case you are unsure, 'Thymeleaf' is pronounced like this: **/ˈtaɪmˌlɪːf/**

![å¨è¿éæå¥å¾çæè¿°][70]

1.配置maven和application.yml ：https://blog.csdn.net/weixin\_43184769/article/details/83212042  
2.在html中要使用Thymeleaf需要先导入：

![å¨è¿éæå¥å¾çæè¿°][70 1]

### **标准表达式语法：** ###

**1.变量表达式：**  
Thymeleaf中的变量表达式和el表达式语法和用途都很类似，例如后台传来一个User对象，user中有name和age属性。在页面中获取的表达式为 $\{user.name\}。需要注意的是$表达式只能写在th标签内部，不然不会生效。

如果按照el表达式的写法：<a value="$\{user.name\}"></a>  
则不会生效，运行时还会报错。

**2.选择（星号）表达式：**  
它和变量表达式用法类似，它是内层对外层对象的引用。  
举个栗子：后台传来一个User对象，user中有name和age属性

<div th:object="$\{user\}">    
      <span th:text="\*\{name\}"> </span>    
     <span th:text="\*\{age\}"> </span>    
    </div>   
  
它和下图的写法效果是一样的

<div >    
      <span th:text="$\{user.name\}"> </span>    
      <span th:text="$\{user.age\}"> </span>    
    </div>   
  
注意，如何没有与th:object结合使用，\*\{\}与$\{\}效果一样，因为其范围自动扩展到context域中。

**3.文字国际化表达式**  
国际化表达式可以从外部的.properties文件中获得文字信息，还可以带参数。Springboot默认读取的是resource/目录下的message.properties文件。

我们首先创建一个messages\_US.properties文件在Resource的根目录下。  
接着在application.yml中配置spring.message.basename=messages\_US就是我们的配置文件名。  
在创建好的配置文件中输入test.hello=hello world!  
创建一个html文件，并在Controller中设置好映射，在HTML中写入  
<h1 th:text="\#\{test.hello\}"></h1>  
运行时就会在页面中输出Hello world!  
语法格式： \#\{key\}  
**4.URL表达式：**  
URL表达式指的是把一个有用的上下文或会话信息添加到URL，这个过程经常被叫做URL重写。  
例如：

<!— 绝对路径 —>  
  
<a href="http://www.baidu.com">普通设置方式</a>  
<a th:href="@\{http://www.baidu.com\}">使用URL表达式打开百度</a>

<a th:href="@\{/index\}"> 打开Controller中映射好的路径</a>  
<a th:href="@\{/index(name=$\{user.m=name\})\}"> 括号中为参数，多参数用逗号隔开</a>

格式：@\{ \}，注意：表达式只能在th标签中使用，带参数的表达式本质就是地址栏传参，和普通的localhost:8080/index.html?name=tom相同

[https_fanyi.baidu.com_aldtype_23_en_zh_thymeleaf]: https://fanyi.baidu.com/?aldtype=23#en/zh/thymeleaf
[https_www.thymeleaf.org]: https://www.thymeleaf.org/
[70]: /images/20220114/ce10e72360dc4d879e3b7adc01c4a480.png
[70 1]: /images/20220114/3dd22aa04ffb48be959394c237db891e.png