SpringBoot基礎實戰系列(一)整合視圖


下一篇:SpringBoot基礎實戰系列(二)springboot解析json與HttpMessageConverter

SpringBoot整合freemarker

1.添加依賴:springboot基本上是無縫銜接,基本上只需要添加對應的依賴,不需要或者做很少量的配置即可

注:對於springboot項目的創建此處不做說明

 <dependency>
     <groupId>org.springframework.boot</groupId>
     <artifactId>spring-boot-starter-freemarker</artifactId>
 </dependency>

2.創建controller

/**
* springboot整合freemarker
*/
@Controller
public class UserController {

   @GetMapping("/user")
   public String user(Model model){
       List<User> list = new ArrayList<>();
       for (int i = 0 ; i < 10 ; i++){
           User user = new User();
           user.setId(i);
           user.setUsername("shangushenlong>>"+i);
           user.setAge(i);
           list.add(user);
       }
       model.addAttribute("users",list);
       return "userInfo";
   }
}

3.創建bean

public class User {
   private Integer id;
   private String username;
   private Integer age;

   @Override
   public String toString() {
       return "User{" +
               "id=" + id +
               ", username='" + username + '\'' +
               ", age=" + age +
               '}';
   }

   public Integer getId() {
       return id;
   }

   public void setId(Integer id) {
       this.id = id;
   }

   public String getUsername() {
       return username;
   }

   public void setUsername(String username) {
       this.username = username;
   }

   public Integer getAge() {
       return age;
   }

   public void setAge(Integer age) {
       this.age = age;
   }
}

4.創建freemarker文件(使用idea創建后綴名 .ftl 的文件)

templates文件夾下創建 userInfo.ftl 文件,如果我們不在application.properties更改配置,則springboot會默認自動去templates尋找相關的文件

<!DOCTYPE html>
<html lang="en">
<head>
   <meta charset="UTF-8">
   <title>Title</title>
</head>
<body>
   <table border="1">
       <tr>
           <td>id</td>
           <td>姓名</td>
           <td>年齡</td>
       </tr>
       <#list users as user>
           <tr>
               <td>${user.id}</td>
               <td>${user.username}</td>
               <td>${user.age}</td>
           </tr>
       </#list>
   </table>
</body>
</html>

注意:

  • freemarker只是一種模板引擎,你可以將其當成另外一種很類似於jsp的語法的html文件
  • 很可能出現的錯誤:路由配置正確,但是就是出現404錯誤,可能原因是需要在配置文件中配置application.properties,指定文件的后綴名 .ftl,因為springboot默認的后綴名很可能不是這個
spring.freemarker.suffix=.ftl

5.以上就是基本的整合配置步驟

SpringBoot整合thymeleaf

1.添加依賴,創建controller,bean等,和上面一樣,代碼如下

2. 添加依賴

<dependency>
    <groupId>org.springframework.boot</groupId>
    <artifactId>spring-boot-starter-thymeleaf</artifactId>
</dependency>

3.創建controller

/**
* springboot整合thymeleaf
*/
@Controller
public class StudentController {

   @GetMapping("/student")
   public String stu(Model model){
       ArrayList<Student> students = new ArrayList<>();
       for (int i = 0 ;i < 10 ; i++) {
           Student student = new Student();
           student.setId(i);
           student.setUsername("shanggushenlong>>" + i);
           student.setAge(String.valueOf(i));
           students.add(student);
       }

       model.addAttribute("students",students);
       return "student";
   }
}

4.創建bean

public class Student {
   private Integer id;
   private String username;
   private String age;

   @Override
   public String toString() {
       return "StudentController{" +
               "id=" + id +
               ", username='" + username + '\'' +
               ", age='" + age + '\'' +
               '}';
   }

   public Integer getId() {
       return id;
   }

   public void setId(Integer id) {
       this.id = id;
   }

   public String getUsername() {
       return username;
   }

   public void setUsername(String username) {
       this.username = username;
   }

   public String getAge() {
       return age;
   }

   public void setAge(String age) {
       this.age = age;
   }
}

5.創建html文件(thymeleaf模板引擎后綴名 .html

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
       "http://www.w3.org/TR/html4/loose.dtd">
<html xmlns:th="http://www.w3.org">
<head>
   <title>Title</title>
</head>
<body>
   <table border="1">
       <tr>
           <td>id</td>
           <td>username</td>
           <td>age</td>
       </tr>
       <tr th:each="stu : ${students}">
           <td th:text="${stu.id}"></td>
           <td th:text="${stu.username}"></td>
           <td th:text="${stu.age}"></td>
       </tr>
   </table>
</body>
</html>

希望自己能一直保持初衷,文章一直寫下去,和大家一起成長

本系列代碼github地址:https://github.com/shanggushenlong/springboot-demo


免責聲明!

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



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