这篇学习在动态模板里面引入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文件。
原创文章，转载请注明出处。