Spring Boot入门<三>SpringBoot的web编程相关及thymeleaf模板引擎

一.SpringBoot在web编程中的"约定大于配置"（WebMvcAutoConfiguration）

1.静态资源默认路径，如果没用thymeleaf可以localhost:8080/Xxx.html访问到

"classpath:/META-INF/resources/",
"classpath:/resources/",
"classpath:/static/",
"classpath:/public/

2.首页面的约定位置

classpath:index.html

3.favicon.icon位置:更换时可能有浏览器缓存

classpath:favicon.icon

二.thymeleaf

 1 @RequestMapping("/index")
 2     public String demo01(Model model){
 3         model.addAttribute("value","世界属于三体!");
 4         return "index";
 5     }
 6 
 7     public class User{
 8         private String name;
 9         private int age;
10         private String html5;
11         private User friend;
12 
13         public String getHtml5() {
14             return html5;
15         }
16 
17         public void setHtml5(String html5) {
18             this.html5 = html5;
19         }
20 
21         public User(){
22             name = "云天明";
23             age= 10;
24             friend= new User("程心",26);
25             html5="<p>三个哲学故事</p>";
26         }
27 
28         public User(String name, int age){
29             this.name= name;
30             this.age = age;
31         }
32 
33         public String getName() {
34             return name;
35         }
36 
37         public void setName(String name) {
38             this.name = name;
39         }
40 
41         public int getAge() {
42             return age;
43         }
44 
45         public void setAge(int age) {
46             this.age = age;
47         }
48 
49         public User getFriend() {
50             return friend;
51         }
52 
53         public void setFriend(User friend) {
54             this.friend = friend;
55         }
56     }
57 
58     @RequestMapping("/demo02")
59     public String demo02(Model model){
60         User u = new User();
61         model.addAttribute("user",u);
62         return "demo02";
63     }
64 
65     @RequestMapping("/demo0101")
66     public String demo0101(Model model){
67         model.addAttribute("date",new Date());
68 
69         ArrayList<User> list = new ArrayList<User>();
70         User user1 = new User();
71         user1.setName("1111");
72         list.add(user1);
73 
74         User user2 = new User();
75         user2.setName("2222");
76         list.add(user2);
77 
78         User user3 = new User();
79         user3.setName("3333");
80         list.add(user3);
81 
82         model.addAttribute("users",list);
83 
84         return "demo01";
85     }
View Code
 1 <!DOCTYPE html>
 2 <html lang="en" xmlns:th="http://www.thymeleaf.org">
 3 <head>
 4     <meta charset="UTF-8">
 5     <title>demo01</title>
 6 </head>
 7 <body>
 8 <!--thymeleaf相关对象:#ctx thymeleaf的pageContext #request #session #response #servletContext-->
 9 <!--thymeleaf全局对象:#dates #calendars #arrays #numbers #bools #strings #sets #lists #maps-->
10 <!--字符串的拼接利用||进行OGNL表达式内容与字面值字符串的拼接-->
11 <span th:text="|今天是：${#dates.format(date,'yyyy-mm-dd')}|"></span>
12 <div th:each="user,stat : ${users}">
13     <span th:text="${user.name}">5555</span>
14     <span th:text="${user.friend.name}">5555</span>
15     <div th:switch="${user.name}">
16         <span th:case="'1111'">我是1111</span>
17         <span th:case="'2222'">我是2222</span>
18         <!--<span th:case="'3333'">我是3333</span>-->
19         <span th:case="*">
20             <!--thymeleaf脚本的预处理-->
21             <script th:inline="javascript">
22                 const user = /*[[${user}]]*/ {};
23                 const age = /*[[${user.age}]]*/ 20;
24                 console.log(user);
25                 console.log(age)
26             </script>
27         </span>
28     </div>
29 </div>
30 </body>
31 </html>
View Code
 1 <!DOCTYPE html>
 2 <html lang="en" xmlns:th="http://www.thymeleaf.org">
 3 <head>
 4     <meta charset="UTF-8">
 5     <title>Title</title>
 6 </head>
 7 <body>
 8 <h2 th:object="${user}">
 9     <h3>只有大脑的：<span  th:text="*{name}">缺省</span></h3>
10     <h3>威慑纪元<span th:text="*{age}">缺省</span>年</h3>
11     <!--  当浏览器不能兼容HTML5 时需要用data-th的指令形式  -->
12     <h3>无法挥剑的：<span  data-th-text="*{friend.name}">缺省</span></h3>
13     <hr/>
14     <!--  为防止HTML的注入，${}表达式获取的值会将符号进行格式化例 < 格式化为 &lt;
15           这时如果不需要格式化需要用 th:utext 指令-->
16     <h3>OGNL表达式输出纯文本:<span th:text="*{html5}">缺省</span></h3>
17     <h3>OGNL表达式输出HTML5解析:<span th:utext="*{html5}">缺省</span></h3>
18 </h2>
19 </body>
20 </html>
View Code

 

posted @ 2020-09-17 14:34  远亭  阅读(145)  评论(0)    收藏  举报