1.3.2 定义视图
为了保持您的主页简洁,它应该做的只是欢迎用户访问网站。下面的程序清单显示了定义 Taco Cloud 主页的基本 Thymeleaf 模板。
程序清单 1.5 Taco Cloud 主页模板
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:th="http://www.thymeleaf.org">
<head>
<title>Taco Cloud</title>
</head>
<body>
<h1>Welcome to...</h1>
<img th:src="@{/images/TacoCloud.png}"/>
</body>
</html>
关于这个模板没有太多要讨论的。唯一值得注意的代码行是显示 Taco Cloud 标志的 <img>
标记。它使用一个 Thymeleaf 的 th:src
属性和一个 @{…}
表达式引用具有上下文相对路径的图片。除去这些,它只是一个 Hello World 页面。
但是让我们再多讨论一下这个图片。我将把它留给您来定义一个您喜欢的 Taco Cloud 标志。您需要将它放在项目中的恰当位置。
该图片是通过上下文相对路径 /images/TacoCloud.png 进行引用的。从我们对项目结构的回顾中可以想起,像图片这样的静态内容保存在 /src/main/resources/static 文件夹中。这意味着 Taco Cloud 标志图片也必须驻留在项目的 /src/main/resources/static/images/TacoCloud.png 中。
现在已经有了处理主页请求的控制器和呈现主页的视图模板,几乎已经准备好启动应用程序并看到它的实际运行效果了。但首先,让我们看看如何针对控制器编写测试。