springBoot 隨筆(二)

時間 2019-11-10

原文原文鏈接

此文爲springBoot 結合 thymeleaf ，解析後臺接口數據展現到html頁面html

基於 springBoot(一)工程。java

1/ 引用 thymeleaf 組件依賴web

         <!--  dependencies 節點下新增-->    
           <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-thymeleaf</artifactId>
        </dependency>

2/ 新建頁面文件存放路徑，存放htmlspring

src/main/resources/templates緩存

3/ 更新application.properties配置文件，新增thymeleaf 配置文件app

#thymelea配置  資源文件目錄
spring.thymeleaf.prefix=classpath:/templates/
#後綴
spring.thymeleaf.suffix=.html
#類型
spring.thymeleaf.mode=HTML5
#編碼
spring.thymeleaf.encoding=UTF-8
#熱部署文件，頁面不產生緩存，及時更新
spring.thymeleaf.cache=false

4/新增數據接口spring-boot

package com.hux.stu.dydatasorce.controller;

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

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;

@RestController
public class ThymeleafDataController {

    @RequestMapping("page")
    public ModelAndView showPage(Model  mode) {
        List list = new ArrayList();
        list.add("a");
        list.add("b");
        list.add("c");
        list.add("d");
        list.add("e");
        //返回視圖以及數據， 根據配置文件 讀取資源目錄下index.html 文件
        return new ModelAndView("index", "list",list);
        
    }
}

5/新增頁面 index.htmlui

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" /> <!-- 自動生成的文件，該節點沒有結束/ ，不添加會報錯 -->
<title>Insert title here</title>
</head>
<body>

<table>
    <tr><td>讀取的數據</td></tr>
    <tr th:if="${list.size()} eq 0">
                <td colspan="3">無數據</td>
      </tr>
      <!--  讀取數據 -->
      <tr th:each="info : ${list}">
                <td th:text="${info}"></td>
      </tr>
      
</table>
</body>
</html>

6/ main方法運行，訪問頁面，http://127.0.0.1:8081/page 查看展現數據，展現abcde列表編碼

相關標籤/搜索

每日一句

每一个你不满意的现在，都有一个你没有努力的曾经。