springBoot去除了spring复杂的配置,我们终于可以安心的写业务代码了。话不多说,直接开干。这里使用thymeleaf作为视图。
1.实体类
public class Person { private String name; private Integer age; public Person(){ super(); } public Person(String name,Integer age){ super(); this.name=name; this.age=age; } public String getName() { return name; } public void setName(String name) { this.name = name; } public Integer getAge() { return age; } public void setAge(Integer age) { this.age = age; } }2.控制器:
@Controller @SpringBootApplication public class FirstSpringBootApplication { @RequestMapping("/") public String index(Model model) { Person single = new Person("aa", 11); List<Person> people = new ArrayList<>(); Person p1 = new Person("xx", 11); Person p2 = new Person("yy", 22); Person p3 = new Person("zz", 33); people.add(p1); people.add(p2); people.add(p3); model.addAttribute("singlePerson", single); model.addAttribute("people", people); return "index"; } public static void main(String[] args) { SpringApplication.run(FirstSpringBootApplication.class, args); } }
3.视图:(需按约定放在templates目录下)
<html xmlns:th="http://www.thymeleaf.org"> <head> <meta content="text/html;charset=UTF-8"/> <meta http-equiv="X-UA-Compatible" content="IE=edge"/> <meta name="viewport" content="width=device-width,initial-scale=1"/> <link th:href="@{bootstrap/css/bootstrap.min.css}" rel="stylesheet"/> <link th:href="@{bootstrap/css/bootstrap-theme.min.css}" rel="stylesheet"/> <title>Title</title> </head> <body> <div class="panel panel-primary"> <div class="panel-heading"> <h3 class="panel-title">访问model</h3> </div> <div class="panel-body"> <span th:text="${singlePerson.name}"></span> </div> </div> <div th:if="${not #lists.isEmpty(people)}"> <div class="panel panel-primary"> <div class="panel-heading"> <h3 class="panel-title">列表</h3> </div> <div class="panel-body"> <ul class="list-group"> <li class="list-group-item" th:each="person:${people}"> <span th:text="${person.name}"></span> <sapn th:text="${person.age}"></sapn> <button class="btn" th:οnclick="'getName(\''+${person.name}+'\');'">获得名字</button> </li> </ul> </div> </div> </div> <script th:src="@{jquery-1.10.2.min.js}" type="text/javascript"></script> <script th:src="@{bootstrap/js/bootstrap.min.js}"></script> <script th:inline="javascript"> var single = [[${singlePerson}]]; console.log(single.name + "/" + single.age); function getName(name) { console.log(name); } </script> </body> </html>
= =好吧,已经完成了,运行main函数,在浏览器中输入localhost:8080就获取到数据了