这篇学习在动态模板里面引入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文件。

原创文章，转载请注明出处。

vert.x学习（六），动态模板与静态文件的结合的更多相关文章

  1. 我的django之旅（二）模板和静态文件

    我的django之旅(二)模板和静态文件 标签(空格分隔): django 1.为什么要使用模板 在上一篇博文中,提到了HttpReponse,但是HttpReponse只能传送字符串,如果要构建一个 ...

  2. django模板和静态文件

    1.为什么要使用模板 在上一篇博文中,提到了HttpReponse,但是HttpReponse只能传送字符串,如果要构建一个网页,那么工作量就会十分巨大.模板是一种方便的标签,存在于HTML文件中,我 ...

  3. Djanjo 的app 模板路径 静态文件 完整版登录 新手三件套 以及orm

    一: django中app的概念: 一个项目可以包含多个应用(app,类似于模块,主页打开多个模块就是多个app) 创建了app,要在配置文件中注册 二:模板路径配置: 1 templates文件夹 ...

  4. Django学习（6）配置静态文件

      本文将详细讲述如何在Django中配置静态文件,如图片(images),JavaScript,CSS等.   我们将要实现的网页如下: 当按下按钮"Change Text"时, ...

  5. django 模板使用静态文件

    1.新建项目 2.新建app,并在install_app中添加该app 3.和app文件夹并列新建static.和TEMPLATES  文件夹,分别放静态文件和模板 4.setting.py中设置 T ...

  6. Django app安装，配置mysql，时区，模板，静态文件，媒体，admin

    1.创建app python manage.py startapp 名字 Migrations 数据库同步目录,记录数据库同步的记录 init 包文件 Admin.py django自带的后台管理文件 ...

  7. 【spring】ApplicationListener传递参数到页面（解决静态+动态资源路径+静态文件的缓存控制）

    一.相对路径还是绝对路径的问题 前端页面加载资源或者请求的时候到底是使用相对路径还是绝对路径,想必大家都很清楚,用的是当然是相对路径,因为这样增加了项目的灵活性,不需要经常的改动.那既然是相对路径就需 ...

  8. flask 安装及基础学习（url_for反转，静态文件引入）

    pip3 install flask pycharm 创建项目 默认的代码解释说明(及开启debug模式) #encoding:utf-8 from flask import Flask #从flas ...

  9. ASP.NET Core 2 学习笔记（五）静态文件

    之前的ASP.NET网站,只要把*.html.*.css.*.jpg.*.png.*.js等静态文件放在项目根目录,默认都可以直接被浏览:但ASP.NET Core 小改了浏览静态文件的方式,默认根目 ...

随机推荐

  1. C#与Java多态方面的语法差异

    C++.C#.Java,无奈三种语言让我多次混淆,多次搞清楚,不写个Demo我想还是会忘记的. 就好像是一个满水的杯子,倒掉一点,才能装下更多. 有时候博客就是一个倒水的地方,可以让我们清空自己,然后 ...

  2. [ubuntu]--vim命令

  3. AngularJS多模块开发

    angularJS中的多模块开发是指多个module模块开发,步骤为: 1. 确定主模块    var app=angular.module('myApp',[]); 2. 其他的子模块添加到主模块后 ...

  4. Intellij IDEA中的Mybatis Plugin破解

    具体的破解过程请看:https://github.com/luyanliang/profile/blob/master/idea/plugin/MybatisPlugin/Mybatis-Plugin ...

  5. 根据google地图抓去全国信息- 抓去全国小区以及新建楼盘信息

    本案例由于google每天每个账户能post20000次所以我们需要相对较长的时间来抓去google的数据信息. 主要思路:通过一定的zoom一个相对较大的zoom.我们尽可能的搜索我们的所有数据. ...

  6. android中设置控件获得焦点 （转）

    android中,要使控件获得焦点,需要先setFocus,再requestFocus. 以Button为例:                 btn.setFocusable(true);      ...

  7. PHP无限极分类

      当你学习php无限极分类的时候,大家都觉得一个字“难”我也觉得很难,所以,现在都还在看,因为工作要用到,所以,就必须得研究研究. 到网上一搜php无限极分类,很多,但好多都是一个,并且,写的很乱, ...

  8. AMD and CMD

    AMD 规范在这里:https://github.com/amdjs/amdjs-api/wiki/AMDCMD 规范在这里:https://github.com/seajs/seajs/issues ...

  9. compass Sprites 雪碧图 小图片合成[Sass和compass学习笔记]

    demo 源码 地址 https://github.com/qqqzhch/webfans 什么是雪碧图? CSS雪碧 即CSS Sprites,也有人叫它CSS精灵,是一种CSS图像合并技术,该方法 ...

  10. NOIP2012拓展欧几里得

    拉板题,,,不说话 我之前是不是说过数据结构很烦,,,我想收回,,,今天开始的数论还要恶心,一早上听得头都晕了 先来一发欧几里得拓展裸 #include <cstdio> void gcd ...