这篇学习在动态模板里面引入css，把动态模板与静态文件结合起来使用。
编写DynamicReference.java
package com.javafm.vertx.helloworld; import io.vertx.core.Vertx;
import io.vertx.core.http.HttpServer;
import io.vertx.ext.web.Router;
import io.vertx.ext.web.handler.StaticHandler;
import io.vertx.ext.web.templ.ThymeleafTemplateEngine;
import org.thymeleaf.templateresolver.ClassLoaderTemplateResolver; /**
* Created by lemontea <36634584@qq.com> on 16-12-20.
*/
public class DynamicReference {
public static void main(String[] args) {
Vertx vertx = Vertx.vertx(); ThymeleafTemplateEngine engine = ThymeleafTemplateEngine.create();
ClassLoaderTemplateResolver resolver = new ClassLoaderTemplateResolver();
resolver.setPrefix("templates");
resolver.setSuffix(".html");
resolver.setTemplateMode("HTML5");
engine.getThymeleafTemplateEngine().setTemplateResolver(resolver); Router router = Router.router(vertx); // 配置动态文件访问路径
router.route("/hello").handler(routingContext -> {
routingContext.put("msg", "DynamicReference.");
engine.render(routingContext, "/hello", res -> {
if (res.succeeded()) {
routingContext.response().putHeader("Content-Type", "text/html").end(res.result());
} else {
routingContext.fail(res.cause());
}
});
}); // 配置静态文件
router.route("/*").handler(StaticHandler.create()); HttpServer httpServer = vertx.createHttpServer();
httpServer.requestHandler(router::accept).listen(8080);
}
}
在这里通过/*来匹配所有的静态文件，而动态模板，则用单个的route来配置，这里是/hello
编写动态模板文件resources/templates/hello.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title>
<!--在动态模板里面引用静态css文件-->
<link rel="stylesheet" href="/css/style.css">
</head>
<body>
<h1 th:text="${msg}"></h1>
</body>
</html>
在这里引入了一个style.css文件，给h1标签设置了颜色样式。这个css文件与上篇学习中的css文件是同一个。
运行http服务，在浏览器查看效果
我们可以看到，访问动态页面的时候，为msg设置了值，并且引用了静态css文件。
原创文章，转载请注明出处。