十三.spring-boot使用spring-boot-thymeleaf


thymeleaf 比如freemaker的要高,thymeleaf是一個支持html原型的自然引擎,它在html 標簽增加額外的屬性來達到模板+數據的展示方式,由於 瀏覽器解釋html時,忽略未定義的標簽屬性,因此thym eleaf的模板可以靜態運行。
由於thymeleaf在內存緩存解析后的模板,解析后的模板 是基於tree的dom節點樹,因此thymeleaf適用於一般 的web頁面,不適合基於數據的xml。
thymeleaf 的context,即提供數據的地方,基於web 的context,即WebContext相對context增加 param,s ession,application變量,並且自動將request atttribu tes添加到context variable map,可以在模板直接訪 問。
在模板處理前,thymeleaf還會增加一個變量execInf o,例:${execInfo.templateName},${execInfo.n ow}等。
數據訪問模式: ${...},變量引用模式,例:${myBean.propert y},如果用springDialect,則使用的是spring EL,如 果不用spring,則用的ognl。

1、*{...},選擇表達式,一般是th:object之后,直接取ob ject中的屬性。當沒有選取對象時,其功能等同${...},

2、* {firstName}也等同於${#object.firstName},#obje ct代表當前選擇的對象。

3、@{...}鏈接url的表達式。th:href="@{/xxx/aa.do(I d=${o.id})",會自動進行url­encoding的處 理。

4、@{...}內部可以是需要計算的表達式,比如: th:href=”@{'/details/'+${user.login}(orderI d=${o.id})}"

 

后續我會補上thymeleaf 指令的是用法…

一、創建maven web project

image

二、編寫測試類

1、新建一個sysuser類

package com.example.entry;

public class SysUser  {
    private Long id;
    private String name;
    private String Phone;
    
    
    
    public SysUser() {
    }
    public SysUser(Long id, String name, String phone) {
        this.id = id;
        this.name = name;
        Phone = phone;
    }
    public Long getId() {
        return id;
    }
    public void setId(Long id) {
        this.id = id;
    }
    public String getName() {
        return name;
    }
    public void setName(String name) {
        this.name = name;
    }
    public String getPhone() {
        return Phone;
    }
    public void setPhone(String phone) {
        Phone = phone;
    }
    @Override
    public String toString() {
        return "SysUser [id=" + id + ", name=" + name + ", Phone=" + Phone + "]";
    }
    
}

2、編寫SysUserController類  :這里需要注意倒入的包

package com.example.controller;

import java.util.ArrayList;
import java.util.List;

import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RestController;
import org.springframework.web.servlet.ModelAndView;

import com.example.entry.SysUser;

@Controller
@RequestMapping("sysUser")
public class SysUserController {

    @RequestMapping("index")
    public String index(Model m) {
        List<SysUser> sysUserList = new ArrayList<SysUser>();
        SysUser u1 = new SysUser(11L, "AAAAA", "123456");
        SysUser u2 = new SysUser(22L, "BBBBB", "123456");
        SysUser u3 = new SysUser(33L, "CCCCC", "123456");
        sysUserList.add(u1);
        sysUserList.add(u2);
        sysUserList.add(u3);
        m.addAttribute("sysUserList", sysUserList);
        m.addAttribute("message", sysUserList.hashCode());
        return "SysUser/list";
    }
}

3、加入html文件  :這里使用的是bootstrap-3.3.7

image

<html xmlns:th="http://www.thymeleaf.org"
    xmlns:layout="http://www.ultraq.net.nz/web/thymeleaf/layout">
<head>
<meta content="text/html;charset=utf-8"></meta>
<meta name="viewport" content="width=device-width, initial-scale=1"></meta>
<script sec="../jquery-2.1.1/jquery.min.js"></script>
<link rel="stylesheet" href="../bootstrap-3.3.7/dist/css/bootstrap.min.css"></link>
<script sec="../bootstrap-3.3.7/dist/js/bootstrap.min.js"></script>
<title>用戶</title>
</head>
<body>
    <div class="container">
        <table class="table">
            <div th:if="${message!=null}">
                <caption th:text="${message}"></caption>
            </div>
            <thead>
                <tr>
                    <th>First Name</th>
                    <th>Last Name</th>
                    <th>User Name</th>
                </tr>
            </thead>
            <tbody>
                <tr>
                    <td>aehyok</td>
                    <td>leo</td>
                    <td>@aehyok</td>
                </tr>
                <tr>
                    <td>lynn</td>
                    <td>thl</td>
                    <td>@lynn</td>
                </tr>
            </tbody>
            <tbody th:each="SysUser:${sysUserList}">
                <tr>
                    <td th:text="${SysUser.id}"></td>
                    <td th:text="${SysUser.name}"></td>
                    <td th:text="${SysUser.Phone}"></td>
                </tr>
            </tbody>
        </table>
    </div>
</body>
</html>

4、配置application.properties支持thymeleaf

spring.thymeleaf.suffix=.html  
spring.thymeleaf.content-type=text/html  
# set to false for hot refresh  
spring.thymeleaf.cache=false 
spring.resources.chain.strategy.content.enabled=true
spring.resources.chain.strategy.content.paths=/**

5、測試訪問

image

6、訪問view層

默認響應的view是的路徑是templates這個目錄

package com.example.controller;

import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.ModelAttribute;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.servlet.ModelAndView;
import org.springframework.web.servlet.resource.ResourceUrlProvider;

@Controller
public class HelloController {

    @Autowired
    ResourceUrlProvider resourceUrlProvider;

    @RequestMapping("index")
    public ModelAndView index() {
        ModelAndView mv = new ModelAndView("index");
        return mv;
    }
    @RequestMapping("demo")
    public ModelAndView demo() {
        ModelAndView mv = new ModelAndView("demo");
        return mv;
    }
    @RequestMapping("signin")
    public ModelAndView signin() {
        ModelAndView mv = new ModelAndView("signin");
        return mv;
    }
}

image

image

image

image


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM