浅浅入门SpringBoot之Thymeleaf模板_百度小程序

相关推荐recommended

浅浅入门SpringBoot之Thymeleaf模板

作者：mmseoamin日期：2023-12-18

Thymeleaf是一个流行的模板引擎,该模板引擎采用Java语言开发模板引擎是一个技术名词,是跨领域跨平台的概念,在Java语言体系下有模板引擎,在C#、PHP语言体系下也有模板引擎,甚至在 Javascript中也会用到模板引擎技术,Java生态下的模板引擎有 Thymeleaf、 Freemaker、Ⅴ elocity、 Beetl(国产)等。

Thymeleaf对网络环境不存在严格的要求,既能用于web环境下,也能用于非web环境下。在非web环境下,他能直接显示模板上的静态数据;在web环境下,它能像Jsp一样从后台接收数据并替换掉模板上的静态数据。它是基于HTML的,以HIML标签为载体,Thymeleaf要寄托在HTML标签下实现。

Spring Boot集成了 Thymeleaf模板技术,并且 Spring boot官方也推荐使用 Thymeleaf来替代JSP技术, Thymeleaf是另外的一种模板技术,它本身并不属于 Spring Boot, Spring Boot只是很好地集成这种模板技术,作为前端页面的数据展示,在过去的 Java Web开发中,我们往往会选择使用Jsp去完成页面的动态渲染,但是jsp需要翻译编译运行,效率低

官网https://www.thymeleaf.org/

浅浅入门SpringBoot之Thymeleaf模板,第1张

SpringBoot框架集成Thymealeaf，Thymealeaf代替jsp。

IDEA设置默认模板

浅浅入门SpringBoot之Thymeleaf模板,第2张

SpringBoot简单实用Thymealeaf

浅浅入门SpringBoot之Thymeleaf模板,第3张

浅浅入门SpringBoot之Thymeleaf模板,第4张

@Controller
public class ControllerA {
    @RequestMapping("/hello")
    public String A(HttpServletRequest request){
        request.setAttribute("data","Thymeleaf hello world");
        //指定视图
        //逻辑名称
        return "A";
    }
}

Title Thymeleaf显示数据:

浅浅入门SpringBoot之Thymeleaf模板,第5张

Thymeleaf模板之常用设置

application.properties配置

#开发阶段，关闭模板缓存，立即生效
spring.thymeleaf.cache=false
#编码格式
spring.thymeleaf.encoding=utf-8
#模型的类型(默认html)
spring.thymeleaf.mode=HTML
#模板前缀、模板引擎存放路径 默认classpath:/templates/
spring.thymeleaf.prefix=classpath:/templates/
#模板后缀 默认.html
spring.thymeleaf.suffix=.html

Thymeleaf模板之标准变量表达式

表达式是在页面获取数据的一种Thymeleaf语法。列:${ key}

注意：th:text=””是Thymeleaf的一个属性，用于显示文本信息。

标准变量表达式用于访问容器(tomcat)上下文环境中的变量，功能和EL中的${}相同。Thymeleaf中的变量表达式使用${变量名}的方式获取Controller中model其中的数据(request作用域中的数据)。

标准变量表达式语法:${key}，作用:获取key对于的文本数据，key是request作用域中的key，使用request.setAttribute()，model.addAttribute()

在html页面中获取数据th:text=”${key}”

@Controller
@RequestMapping("/t")
public class ControllerB {
    @RequestMapping("/hello2")
    public String B(Model model){
        model.addAttribute("Student",new Student(1,"小红","女"));
        System.out.println("ControllerB");
        return "abc";
    }
}

浅浅入门SpringBoot之Thymeleaf模板,第6张

student:

浅浅入门SpringBoot之Thymeleaf模板,第7张

Thymeleaf模板之选择变量表达式

语法格式：*{key} 作用：获取key对应的数据库,*{key}需要和th:object这个属性一起使用。

@RequestMapping("/hello3")
public String C(Model model){
    model.addAttribute("Student",new Student(1,"小明","男"));
    System.out.println("ControllerC");
    return "C";
}

浅浅入门SpringBoot之Thymeleaf模板,第8张

Thymeleaf模板之链接表达式

语法：@{url} 作用：表示链接

列如:
 
 
Thymeleaf模板之属性使用 
属性是放在html元素中的，就是html元素的属性，加上th，属性的值由模板引擎处理。 
属性：th:action  th:method th:href th:src th:text th:style th:each 
th:action 
定义后台控制器的路径，类似
标准的action属性 th:action="@{/t/login}" 
th:method 
定义get，post方法  th:method="${method}" 
th:href 
定义超链接，结合URL表达式，获取动态变量 
百度链接 
th:src 
用于引入外部资源，类似 
th:text 
设置显示文本 ${key} 
 
 
//Thymeleaf属性的使用
@GetMapping ("/property01")
public String property(Model model){
    model.addAttribute("id","12345");
    model.addAttribute("method","post");
    model.addAttribute("password","123455");
    model.addAttribute("color","color:#f76730");
    return "pro";
}
@PostMapping("/login")
@ResponseBody
public String login(int id,String password){
    return "账户id："+id+"账户密码:"+password;
} 
 
 

属性的使用
    
        
            
            
            
        
    
hello world
hello world
hello world
 
 
 
Thymeleaf模板之循环 
th:each这个属性非常常用，与JSTL中的类似.可以循环遍历集合，也可以循环变量数组和map 
循环List 
    
 
循环的状态变量 
Index: 当前迭代对象的下标(0-n) 
Count:当前迭代对象个数(0-n) 
Size：被迭代对象的大小 
Current：当前迭代变量 
even/odd :布尔值，当前循环是否为偶数/奇数 
first：是否第一个 
last：是否最后一个 
 
Controller 
//    循环list
    @GetMapping("/eachList")
    public String eachList(Model model){
        List strList = new ArrayList<>();
        strList.add("张三");
        strList.add("李四");
        strList.add("保国");
        model.addAttribute("strList",strList);
        List students = new ArrayList<>();
        students.add(new Student(10,"张三","男"));
        students.add(new Student(11,"李四","男"));
        students.add(new Student(12,"保国","男"));
        model.addAttribute("students",students);
        return "E";
    } 
 
 
Html页面 
    
    
    
    
    
    
        
            
                下标
                id
                name
                sex
            
        
        
        
            
            
            
            
        
        
    
 
 
循环数组Array 
controller 
//循环数组
@GetMapping("/eachArray")
public  String array(Model model){
    String[] name =new String[3];
    name[0]="张三2";
    name[1]="李四2";
    name[2]="保国2";
    model.addAttribute("names",name);
    return "array";
} 
 
Html页面 
循环Array
  
    
    
      编号
      name
    
    
    
    
      
      
    
    
  
 
 
循环Map 
Controller 
//循环map
    @GetMapping("/eachMap")
    public String eachMap(Model model){
        Map map =new HashMap<>();
        map.put("stu1",new Student(11,"保国1","男"));
        map.put("stu2",new Student(12,"保国2","男"));
        map.put("stu3",new Student(13,"保国3","男"));
        map.put("stu4",new Student(14,"菜坤","男"));
        model.addAttribute("stuMap",map);
        return "Map";
    } 
 
Html页面 
循环Map
    
        
        
            编号
            key
            id
            name
            sex
        
        
        
        
            
            
            
            
            
        
        
    
 
 
循环List> 
@GetMapping("/eachListMap")
public String eachListMap(Model model){
    List> listMap =new ArrayList<>();
    Map map1 =new HashMap<>();
    map1.put("stu1",new Student(11,"保国11","男"));
    map1.put("stu2",new Student(12,"保国12","男"));
    map1.put("stu3",new Student(13,"保国13","男"));
    map1.put("stu4",new Student(14,"菜坤1","男"));
    Map map2 =new HashMap<>();
    map2.put("stu12",new Student(11,"保国112","男"));
    map2.put("stu22",new Student(12,"保国122","男"));
    map2.put("stu32",new Student(13,"保国132","男"));
    map2.put("stu42",new Student(14,"菜坤12","男"));
    listMap.add(map1);
    listMap.add(map2);
    model.addAttribute("ListMap",listMap);
    model.addAttribute("listMap",listMap);
    return "Map";
} 
 
循环List-Map
    
        
        
            编号
            key
            id
            name
            sex
        
        
        
        
            
                
                
                
                
                
            
        
        
    
 
  
Thymeleaf模板之if和unless 
语法：th:if”boolean条件”，条件为true显示体内容 
Th:unless是th:if的一个相反操作 
 
显示内容 
显示内容 
 
用例 
controller 
@GetMapping("/ifl")
public String ifanUnless(Model model){
    model.addAttribute("name","z");
    model.addAttribute("login","true");
    model.addAttribute("age",30);
    model.addAttribute("empty1","");
    model.addAttribute("fnull",null);
    return "IfUnless";
} 
 
html 

张三
登入成功
年龄小于40

true

为null
 
 
 
 
Thymeleaf模板之switch-case 
@GetMapping("/switch")
public String switchCase(Model model){
        model.addAttribute("sex",'m');
        return "switch";
    } 
 
switch的使用
    男
    女
    未知
 
 
Thymeleaf模板之内联text 
 
@GetMapping("/inline")
public String inlineDemo(Model model){
    model.addAttribute("name","z");
    model.addAttribute("age",30);
    model.addAttribute("sex","m");
    model.addAttribute("stu",new Student(14,"菜坤","男"));
return "inline";
} 
 
  
  名字[[${name}]]
  年龄[(${age})]
  [['I love yue']]
  [[${stu.id}]],[[${stu.name}]],[[${stu.sex}]]
 
 
Thymeleaf模板之内联javascript 
 
 
 
 
 
 
Thymeleaf模板之字面值 
文本字面量 
 
 
数字字面量 
年龄小于40 
 
Bollean字面量 
登入成功 
 
Null字面量 
name不为null

true

为null 
 
 
Thymeleaf模板之字符串连接 
方式1 
 
方式2 
 
 
 
Thymeleaf模板之运算符 
算术运算符：+，-，*，/，% 
关系比较：>，<，>=，<=  (gt，lt，ge，le) 
相等判断：==，!=  （eq，ne） 
 
@GetMapping("/inline")
public String inlineDemo(Model model){
    model.addAttribute("name","z");
    model.addAttribute("age",30);
    model.addAttribute("sex","m");
    model.addAttribute("stu",new Student(14,"菜坤","男"));
    model.addAttribute("fnull",null);
    model.addAttribute("login",true);
return "inline";
} 
 
 
 运算符的使用
  年龄大于10
  结果
  为null
  三元运算符：
 
 
 
 
 
Thymeleaf模板之内置对象使用 
 
//内置对象
@GetMapping("/object")
public String built_in_Object(Model model, HttpServletRequest request, HttpSession session){
    model.addAttribute("name","坤坤");
    request.setAttribute("requestFata","request作用域数据");
    request.getSession().setAttribute("sessionData","session作用域的数据");
    return "builtinObject";
} 
 
 
 
hello builtinObject
    获取作用域中的数据
    获取request域中的数据
    
    
 
 
 
 
Thymeleaf模板之内置#request对象方法 
 
    使用内置对象的方法
    
    
    
    

    

 
 
 
Thymeleaf模板之内置对象#session对象方法 
Session表示HttpSession对象的，是#session的简单表示方式。 
    
    

 
 
 
 
Thymeleaf模板之param对象 
Param对象表示url请求的参数集合 
 
 
    
    

 
 
 
 
Thymeleaf模板之内置工具类 
 
#dates 
 
@GetMapping("/unlist")
public String utileObject(Model model){
    model.addAttribute("Mdate",new Date());
    return "utileObject";
} 
 
 
 
  日期类工具类对象
  
  

  

  

  

  

  

 
 
 
#numbers 
@GetMapping("/unlist")
public String utileObject(Model model){
    model.addAttribute("numbers",45.01);
    return "utileObject";
} 
 
    
    

 
 
 
 
 
 
 
#strings 
@GetMapping("/unlist")
public String utileObject(Model model){
    model.addAttribute("Stirng","1234fdghdtgjuefS");
    return "utileObject";
} 
 
 
    
    

    

    

    

 
 
 
 
 
 
#lists 
 
@GetMapping("/unlist")
public String utileObject(Model model){
    List list = Arrays.asList("A","B","C");
    return "utileObject";
} 
 
 
    
    

    

 
 
 
 
Null处理 
 
@GetMapping("/unlist")
public String utileObject(Model model){
    Cat cat =new Cat();
    cat.setName("狸花猫");
    Dog dog =new Dog();
    dog.setName("阿拉斯加");
    Pet p =new Pet(cat,dog);
    model.addAttribute("pet",p);
    return "utileObject";
} 
 
 
 
 
 
当cat值不为null时，才执行name 
    null处理
    
    

 
 
 
 
 
Thymeleaf模板之自定义模板 
自定义模板，在其他模板文件中多次使用 
Hello为自定义模板名称 
 
  hello world
 
 
引用模板 
插入模板方式1 
 
 
                     
插入模板方式2 
 
 
 
包含模板 
方式2
 
 
 
                  
html页面做模板 
 
 

 
 

 
 
 
 
 
使用其他目录中的模板 
 
  企业网站建设服务  我的大学生活网页制作模板  怎样创建自己的网站平台  网站制作哪家专业  关于企业网站建设数据现状分析  黄石网站建设公司

上一篇：java: You aren‘t using a compiler supported by lombok, so lombok will not work and has been disabled

下一篇：带你了解SpringBoot---开启Durid 监控