spring boot thymeleaf基本用法总结

thymeleaf教程地址:https://www.e-learn.cn/index.php/thymeleaf

根据我看的文档,我建立了个简单的spring boot +thymeleaf项目

git 路径 https://github.com/fulq1234/lunmei/tree/master/thymeleaf-demo

 

注意:

三.*{...}选择表达式

注意th:object应该包含th:text,不能平行。

<div th:object="${last}"><!--选择表达式就像变量表达式一样,它们不是整个上下文变量映射上执行,而是在先前选择的对象(html元素包含关系)-->
    <span th:text="*{name}"></span><!--name是last变量的一个属性-->
</div>

四.消息(i18n)表达式

实现国际化的方式:

1.在resources下面增加:messages.properties,messages_en.properties,messages_zh_CN.properties

2.页面使用:

<span th:text="#{home.welcome}"></span><br/>
<span th:text="#{home.age(6,1)}"></span><br/><!--多语言有参数的情况-->

3.messages_zh_CN.properties中要用native2ascii编码

如果原来是:

home.welcome=我是中国人
home.loveme=我爱我的祖国
home.age=我今年{0}岁了,我上小学{1}年级了。

编码后会变成:

home.welcome=\u6211\u662f\u4e2d\u56fd\u4eba
home.loveme=\u6211\u7231\u6211\u7684\u7956\u56fd
home.age=\u6211\u4eca\u5e74{0}\u5c81\u4e86\uff0c\u6211\u4e0a\u5c0f\u5b66{1}\u5e74\u7ea7\u4e86\u3002

方法1:是使用开发工具的插件

方法2:使用jdk里面的命令

 执行过程是

命令的第一个参数是,编码前的文件,第二个参数是编码后输出内容到这个新的文件。

五.链接(URL)表达式

这里因为application.yml的context-path有值,所以在页面中很多地方跳转时需要到这个

server:
  servlet:
    context-path: /th-demo
  port: 8081

<a th:href="@{/admin}" th:text="@{/admin}"/>

输出的字符串是/th-demo/admin,还可以带着参数,如下所示:
<a th:href="@{/admin(id=3,name=xiaoming)}" th:text="@{/admin(id=3,name=xiaoming)}"/>

输出的字符串是/th-demo/admin?id=3&name=xiaoming

六.~{...} : 片段表达式。

th:fragment:自定义片段名
th:replace:不要自己的主标签,保留th:fragment的主标签
th:insert:保留自己的主标签,保留th:fragment的主标签
th:include:保留自己的主标签,不要th:fragment的主标签。(官方3.0后不推荐)

七.Thymeleaf简单格式化输出

格式化时间:
<dd th:text="${#dates.format(last.createTime, 'yyyy-MM-dd')}"></dd>
第一参数5是整数部分,如果整数部分不满五位,会用0补齐;第二个参数3是小数部分位数,小数点后面保留两位。:
<dd th:text="${#numbers.formatDecimal(last.id, 5, 3)}">350</dd>

显示情况:

附录:

项目文件目录如下:

pom.xml

<!--spring mvc必须的-->
<dependency>
    <groupId>org.springframework.boot</groupId>
    <artifactId>spring-boot-starter-web</artifactId>
</dependency>

<!--thymeleaf 必须的-->
<dependency>
    <groupId>org.springframework.boot</groupId>
    <artifactId>spring-boot-starter-thymeleaf</artifactId>
</dependency>

Controller

package com.example.thymeleafdemo.controller;

import com.example.thymeleafdemo.entity.User;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.servlet.ModelAndView;

import java.text.ParseException;
import java.text.SimpleDateFormat;
import java.util.ArrayList;
import java.util.Date;
import java.util.List;

@Controller
@RequestMapping("/th")
public class ThDemo1Controller {

    @RequestMapping("/mv")
    public ModelAndView mv(){
        ModelAndView mv = new ModelAndView();

        //单个词
        mv.addObject("username","zhangsan");

        List<User> list = new ArrayList<User>();
        User user = new User();
        SimpleDateFormat df = new SimpleDateFormat("yyyy-MM-mm");
        for(int i = 0;i<100;i++){
            user.setId(i);
            user.setName("user," + i);
            try {
                Date d = df.parse("2" + i +"-11-11");
                user.setCreateTime(d);
            } catch (ParseException e) {
                e.printStackTrace();
            }
        }
        list.add(user);
        mv.addObject("list",list);

        mv.addObject("last",user);

        mv.setViewName("a");
        return mv;
    }
}

实体类

package com.example.thymeleafdemo.entity;


import java.util.Date;

public class User {
    private Integer id;
    private String name;
    private Date createTime;

    //...getter,setter方法
}

最主要的是a.html

<html xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.w3.org/1999/xhtml">
<head>
</head>

<body>

<h1>一.原始值</h1>
<input type="text" th:value="文字输入值"/>


<h1>二.${...}变量表达式</h1>
<span th:text="${username}"/>


<h1>三.*{...}选择表达式</h1>
<div th:object="${last}"><!--选择表达式就像变量表达式一样,它们不是整个上下文变量映射上执行,而是在先前选择的对象(html元素包含关系)-->
    <span th:text="*{name}"></span><!--name是last变量的一个属性-->
</div>


<h1>四.消息(i18n)表达式</h1>
<span th:text="#{home.welcome}"></span><br/>
<span th:text="#{home.age}"></span><br/>
<span th:text="#{home.age(5)}"></span><br/>
<span th:text="#{home.age(6,1)}"></span><br/><!--多语言有参数的情况-->


<h1>五.链接(URL)表达式</h1><!--因此,对于部署在Web服务器的/myapp上下文中的Web应用程序,可以使用以下表达式:-->
<a th:href="@{/admin}" th:text="@{/admin}"/>
<br/>带参数的链接@{/admin(id=3,name=xiaoming)}:<br/>
<a th:href="@{/admin(id=3,name=xiaoming)}" th:text="@{/admin(id=3,name=xiaoming)}"/>


<h1>六.~{...} : 片段表达式。</h1>
<li>th:replace :不要自己的主标签,保留th:fragment的主标签:</li>
<div th:replace="~{b :: copy}" style="border: 5px solid blue;float:left;width:100%" />
<li>th:insert   :保留自己的主标签,保留th:fragment的主标签。:</li>
<div th:insert="~{b :: copy}" style="border: 5px solid green;float:left;width:100%" />
<li>th:include :保留自己的主标签,不要th:fragment的主标签。(官方3.0后不推荐)</li>
<div th:include="~{b :: copy}" style="border: 5px solid chartreuse;float:left;width:100%" />


</body>

</html>

b.html

<html xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.w3.org/1999/xhtml">

<div th:fragment="copy" style="border: 1px solid red;float:left;width:100%">
    <br/>
    <table align="left"  border="1">
        <tr>
            <td>姓名:</td>
            <td>th:fragment自定义片段名</td>
        </tr>
        <tr>
            <td>性别:</td>
            <td>男</td>
        </tr>
    </table>
</div>

页面展示效果:

  • 2
    点赞
  • 5
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值