springboot+maven+thymeleaf配置實戰demo

 

 

　　　　本案例使用thymeleaf，與springboot配置使用。thymeleaf是一種模板語言，能夠動態或者靜態顯示文本內容。

　　1 、項目結構

　　　　

　　

　　二、構建springboot項目

　　　　經過idea的new project構建springboot項目，若是mvn比較慢，建議更改maven目錄下的conf中的setting.xml，找到mirrors,在裏面加入這段話

　　　　　<id>nexus-aliyun</id>
        <mirrorOf>*</mirrorOf>
        <name>Nexus aliyun</name>
        <url>http://maven.aliyun.com/nexus/content/groups/public</url>

　　

　　三、添加thymeleaf配置

　pom.xml中插入

　　、

　　在application.properties中添加

#thymelea模板配置
spring.thymeleaf.prefix=classpath:/templates/
spring.thymeleaf.suffix=.html
spring.thymeleaf.mode=HTML5
spring.thymeleaf.encoding=UTF-8
#熱部署文件，頁面不產生緩存，及時更新
spring.thymeleaf.cache=false
spring.resources.chain.strategy.content.enabled=true
spring.resources.chain.strategy.content.paths=/**

 

　　四、先運行項目，防止出現問題，啓動項目。

　　

　先建個類測試

　　

 

 　　啓動項目後，在瀏覽器中輸入http://127.0.0.1:8080/hello，出現  wanshanghao

　　

　　5 如今開始寫mvc

　

package com.example.demo.controller;

/**
 * Created by Administrator on 2018/4/24 0024.
 */
    import com.example.demo.domain.User;
    import com.example.demo.repository.UserRepository;
    import org.springframework.beans.factory.annotation.Autowired;
    import org.springframework.ui.Model;
    import org.springframework.web.bind.annotation.GetMapping;
    import org.springframework.web.bind.annotation.PathVariable;
    import org.springframework.web.bind.annotation.PostMapping;
    import org.springframework.web.bind.annotation.RequestMapping;
    import org.springframework.web.bind.annotation.RestController;
    import org.springframework.web.servlet.ModelAndView;

    import java.util.List;


/**
     * 用戶控制器.
     *
     */
    @RestController
    @RequestMapping("/users")
    public class UserController {

        @Autowired
        private UserRepository userRepository;

        /**
         * 從 用戶存儲庫 獲取用戶列表
         * @return
         */
        private List<User> getUserlist() {
            return userRepository.listUser();
        }

        /**
         * 查詢所用用戶
         * @return
         */
        @GetMapping
        public ModelAndView list(Model model) {
            model.addAttribute("userList", getUserlist());
            model.addAttribute("title", "用戶管理");
            return new ModelAndView("users/list", "userModel", model);
        }

        /**
         * 根據id查詢用戶
         * @return
         */
        @GetMapping("{id}")
        public ModelAndView view(@PathVariable("id") Long id, Model model) {
            User user = userRepository.getUserById(id);
            model.addAttribute("user", user);
            model.addAttribute("title", "查看用戶");
            return new ModelAndView("users/view", "userModel", model);
        }

        /**
         * 獲取 form 表單頁面
         * @return
         */
        @GetMapping("/form")
        public ModelAndView createForm(Model model) {
            model.addAttribute("user", new User());
            model.addAttribute("title", "建立用戶");
            return new ModelAndView("users/form", "userModel", model);
        }

        /**
         * 新建用戶
         * @param user
         * @return
         */
        @PostMapping
        public ModelAndView create(User user) {
            user = userRepository.saveOrUpateUser(user);
            return new ModelAndView("redirect:/users");
        }

        /**
         * 刪除用戶
         * @param id
         * @return
         */
        @GetMapping(value = "delete/{id}")
        public ModelAndView delete(@PathVariable("id") Long id, Model model) {
            userRepository.deleteUser(id);

            model.addAttribute("userList", getUserlist());
            model.addAttribute("title", "刪除用戶");
            return new ModelAndView("users/list", "userModel", model);
        }

        /**
         * 修改用戶
         */
        @GetMapping(value = "modify/{id}")
        public ModelAndView modifyForm(@PathVariable("id") Long id, Model model) {
            User user = userRepository.getUserById(id);

            model.addAttribute("user", user);
            model.addAttribute("title", "修改用戶");
            return new ModelAndView("users/form", "userModel", model);
        }


}

package com.example.demo.domain;

/**
 * Created by nicknailo on 2018/4/24 0024.
 */


import javax.xml.bind.annotation.XmlRootElement;

/**
 * User.
 */
@XmlRootElement // mediatype 轉爲xml
public class User {

    private long id; // 用戶的惟一標識
    private String name;
    private int age;

    public User() {
    }

    public User(String name, int age) {
        this.name = name;
        this.age = age;
    }
    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 int getAge() {
        return age;
    }

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

}

package com.example.demo.repository;

/**
 * Created by nicknailo on 2018/4/24 0024.
 */


import com.example.demo.domain.User;

import java.util.List;

/**
 * 用戶倉庫.
 */
public interface UserRepository {
    /**
     * 新增或者修改用戶
     * @param user
     * @return
     */
    User saveOrUpateUser(User user);

    /**
     * 刪除用戶
     * @param id
     */
    void deleteUser(Long id);

    /**
     * 根據用戶id獲取用戶
     * @param id
     * @return
     */
    User getUserById(Long id);

    /**
     * 獲取全部用戶的列表
     * @return
     */
    List<User> listUser();
}

package com.example.demo.repository;

        import java.util.ArrayList;
        import java.util.List;
        import java.util.concurrent.ConcurrentHashMap;
        import java.util.concurrent.ConcurrentMap;
        import java.util.concurrent.atomic.AtomicLong;
        import com.example.demo.domain.User;
        import org.springframework.stereotype.Repository;

/**
 * 用戶資源庫.
 */
@Repository
public class UserRepositoryImpl implements UserRepository {

    private static AtomicLong counter = new AtomicLong();

    private final ConcurrentMap<Long, User> userMap = new ConcurrentHashMap<Long, User>();

    public UserRepositoryImpl(){
        User user = new User();
        user.setAge(30);
        user.setName("大西瓜");
        this.saveOrUpateUser(user);
    }

    /* (non-Javadoc)
     * @see com.waylau.spring.boot.thymeleaf.repository.UserRepository#saveUser(com.waylau.spring.boot.thymeleaf.vo.UserVO)
     */
    @Override
    public User saveOrUpateUser(User user) {
        Long id = user.getId();
        if (id <= 0) {
            id = counter.incrementAndGet();
            user.setId(id);
        }
        this.userMap.put(id, user);
        return user;
    }

    /* (non-Javadoc)
     * @see com.waylau.spring.boot.thymeleaf.repository.UserRepository#deleteUser(java.lang.Long)
     */
    @Override
    public void deleteUser(Long id) {
        this.userMap.remove(id);
    }

    /* (non-Javadoc)
     * @see com.waylau.spring.boot.thymeleaf.repository.UserRepository#getUserById(java.lang.Long)
     */
    @Override
    public User getUserById(Long id) {
        return this.userMap.get(id);
    }

    /* (non-Javadoc)
     * @see com.waylau.spring.boot.thymeleaf.repository.UserRepository#listUser()
     */
    @Override
    public List<User> listUser() {
        return new ArrayList<User>(this.userMap.values());
    }

}

 

　　footer.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>action is everything</title>
</head>
<body>
    <div  data-th-fragment="header">
        <h1> Thyleaf in action </h1>
        <a href = "/users">首頁</a>
    </div>
</body>
</html>

 

　　header.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>action is everything</title>
</head>
<body>
    <div  data-th-fragment="header">
        <h1> Thyleaf in action </h1>
        <a href = "/users">首頁</a>
    </div>
</body>
</html>

 

　　form.html

　　

<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org" >
<head>
    <meta charset="UTF-8">
    <title>welcome</title>
</head>
<body>
    <div th:replace="fragments/header :: header">...</div>
    <h3 th:text="${userModel.title}">Welcome to springboot</h3>
    <form action="/users" th:action="@{/users}" method="post" th:object="${userModel.user}" >
        <input type="hidden" name="id" th:value="${userModel.user.id}">
        名稱：<br>
        <input type="text" name="name" th:value="*{name}">
        <br>
        年齡：<br>
        <input type="text" name="age" th:value="*{age}">
        <input type="submit" value="提交">
    </form>



    <div th:replace="~{fragments/footer :: footer}">...</div>

</body>
</html>

 

　　list.html

<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org" >
<!--<html xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org" >-->
<!--<html xmlns:th="http://www.thymeleaf.org"-->
      <!--xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout">-->
<head>
    <meta charset="UTF-8">
    <title>今晚天氣好</title>
</head>
<body>
    <div th:replace="fragments/header :: header">...</div>
    <h3 th:text="${userModel.title}">Welcome to springboot</h3>
    <div>
        <!--<a href="/users/form.html" th:href="@{/users/form}">建立用戶</a>-->
        <a th:href="@{/users/form}" >建立用戶</a>
    </div>
    <table border="1">
        <thead>
            <tr>
                <td>ID</td>
                <td>Age</td>
                <td>Name</td>
            </tr>
        </thead>
        <tbody>
            <tr th:if="${userModel.userList.size()} eq 0">
                <td colspan="3">沒有用戶信息！！</td>
            </tr>
            <tr th:each="user : ${userModel.userList}">
                <td th:text="${user.id}">1</td>
                <td th:text="${user.age}">11</td>
                <td>
                    <a href="view.html" th:href="@{'/users/' + ${user.id}}"
                       th:text="${user.name}">wss</a></td>
            </tr>
        </tbody>

    </table>

    <div th:replace="~{fragments/footer :: footer}">...</div>
</body>
</html>

　

　view.html

<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org" >
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
    <div th:replace="fragments/header :: header">...</div>
    <h3 th:text="${userModel.title}">Welcome to springboot</h3>
    <div>
        <p><strong>ID:</strong><span id="id" th:text="${userModel.user.id}"></span></p>
        <p><strong>Age:</strong><span id="id" th:text="${userModel.user.age}"></span></p>
        <p><strong>Name:</strong><span id="id" th:text="${userModel.user.name}"></span></p>
    </div>

    <div>
        <a  th:href="@{'/users/delete/' + ${userModel.user.id} }">刪除</a>
        <a  th:href="@{'/users/modify/' + ${userModel.user.id} }">修改</a>
    </div>

    <div th:replace="~{fragments/footer :: footer}">...</div>

</body>
</html>

 

　　代碼運行效果，