Spring Boot框架开发Web项目之三 第一个页面

本系列文章主要索引详情 点击查看


 现在我们已经搭建好了Web框架,下面我们开始将第一个页面插入到我们的应用中来。

工具

IntelliJ IDEA 16

JDK 1.8

Maven 3.5

Tomcat 1.8

第一个页面

视图通常会与某种模板方言关联,这种模板允许遍历模型中的内容,流行的模板方言包括JSP、FreeMarker、Thymeleaf。在此,我们将使用Thymeleaf,Thymeleaf是一个模板引擎,它的成功在很大程度上要归因于对用户友好的语法(它几乎就是HTML)以及扩展的便利性。

关于Thymeleaf与Spring集成有一个很好的入门指南,参见:http://www.thymeleaf.org/doc/tutorials/2.1/thymeleafspring.html

1、添加Thymeleaf模板引擎

闲言少叙,下面我们开始将thymeleaf依赖添加到项目中,这样我们就能启动Thymeleaf模板引擎了,Maven环境下添加如下:

打开pom.xml,编辑如下图所示

2、添加页面

现在讲第一个页面添加到项目中,在src/main/resources/templates中新建一个HTML页面,并将其命名为resultPage.html,添加后目录结构如下

打开resultPage.html,编辑文件

3、修改Controller类

此时HelloController类必须要导航至我们新建的视图,而不是再展示简单的文本。为了完成该功能,我们需要移除@CRestController注解。这样做完之后,如果再次返回字符串的话,就会高数Spring MVC要将这个字符串隐射为视图名,而不是在响应中直接展现特定的模型。

我们的控制器将会变为如下所示

4、测试运行

现在,控制器会将用户的请求转移到resultPage的视图中,ViewResolver接口会将这个名字与我们的视图进行关联。

启动应用并访问: http://localhost:8080/he

我们将看到页面

说明:

th:text的值放在两个竖线中间,这意味着文本中所有的值都会连接在一起。

如果没有添加两个竖线则访问时会出现如下异常

对于Web设计人员来说,Thymeleaf有一项很大的优势,那就是在服务器没有运行的时候,模板中所有的动态内容都可以采用一个默认值(如resultPage.html中的 <span>标签中的文本“hello html”)。资源URL可以采用相对的路径来指定,每个标签都可以包含占位符,在前面的样例中,如果是在应用的上下中,那么文本“hello html”不会显示,但是如果直接再Web浏览器中打开这个文件的话,那么它就会显示“hello html”,而不会显示“hello thymeleaf”了。



上一篇:Spring Boot框架开发Web项目之二 Hello Spring Boot

下一篇:Spring Boot框架开发Web项目之四 将数据传递给视图

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容