一、案例
1.1 pom.xml
<dependencies> <!-- 除去logback支持 --> <dependency> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-web</artifactId> <exclusions> <exclusion> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-logging</artifactId> </exclusion> </exclusions> </dependency> <dependency> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-test</artifactId> <scope>test</scope> </dependency> <!-- 使用log4j2，該包paren標簽中已經依賴 --> <dependency> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-log4j2</artifactId> </dependency> <dependency> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-devtools</artifactId> </dependency> <!-- 引入freemarker包 --> <dependency> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-freemarker</artifactId> </dependency> </dependencies> <build> <plugins> <plugin> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-maven-plugin</artifactId> </plugin> </plugins> </build>
1.2 application.properties
#主配置文件，配置了這個會優先讀取里面的屬性覆蓋主配置文件的屬性
spring.profiles.active=dev
server.port=8888
logging.config=classpath:log4j2-dev.xml
1.3 編寫控制器
package com.shyroke.controller; import java.util.ArrayList; import java.util.List; import org.springframework.stereotype.Controller; import org.springframework.web.bind.annotation.RequestMapping; import org.springframework.web.servlet.ModelAndView; @Controller @RequestMapping(value = "/index") public class IndexController { @RequestMapping(value = "/login") public ModelAndView index(ModelAndView modelAndView) { modelAndView.setViewName("index"); List<String> userList=new ArrayList<String>(); userList.add("admin"); userList.add("user1"); userList.add("user2"); modelAndView.addObject("userList", userList); return modelAndView; } }
1.5 編寫index.ftl
<!DOCTYPE html> <html> <head lang="en"> <title>Spring Boot Demo - FreeMarker</title> <link href="/css/index.css" rel="stylesheet"> <script type="text/javascript" src="/jars/jquery-3.2.1.min.js"></script> <script type="text/javascript" src="/js/index.js"></script> </head> <body> <h2>首頁<h2> <font> <#list userList as item> ${item!}<br /> </#list> </font> <button class="a"> click me</button> </body> </html>
1.6 index.js
$(function() { $('.a').click(function() { alert('hello world'); }); })
1.7 index.css
h2{color:red}
1.8 目錄結構
-
結果
