Velocity布局祥解

最新推荐文章于 2019-08-08 22:25:05 发布

psiitoy

最新推荐文章于 2019-08-08 22:25:05 发布

阅读量668

点赞数

分类专栏：前台技术文章标签： velocity

前台技术专栏收录该内容

30 篇文章 0 订阅

订阅专栏

大多数网站的每个页面布局差别不是太大，除非一些特殊页面例如门户首页等。如果每个页面独立一个文件，则会导致不同文件出现大量相同的代码，我们也可以把这些相同的代码抽取出来放在一个独立的小文件，需要的时候利用 Velocity的#parse指令来嵌入到目标页面中。但是此法却对页面上用于控制排版的HTML代码无效，因为控制整个页面排版的代码一般会贯穿整个文件，开头、结尾皆有，无法分拆到独立的文件上，因此就有将页面的layout独立出来的，以减小页面的代码量的需要。

我在用Velocity时一般都是使用Velocity-Tools项目的VelocityViewServlet来负责解析所有Velocity 模板的请求，其实VelocityTools也提供另外一个Servlet便是VelocityLayoutServlet，该类直接从 VelocityViewServlet继承而来，通过使用VelocityLayoutServlet可以让我们很容易的将页面的布局控制模板和数据模板分隔开来。欲使用此功能，请遵循以下步骤：

1。使用VelocityLayoutServlet类：原先的VelocityViewServlet直接替换成 VelocityLayoutServlet；

2。配制VelocityLayoutServlet：打开velocity.properties增加配制如下：

 
#  处理错误信息的模板路径
 
#  relative to web application root directory
 
tools.view.servlet.error.template = error.vm
 
 
 
#  所有布局文件的默认路径
 
#  relative to web application root directory
 
tools.view.servlet.layout.directory = /WEB-INF/layout/
 
 
 
#  默认的布局文件
 
#  relative to the layout directory
 
#  NOT relative to the root directory of the webapp!
 
tools.view.servlet.layout.default.template =  default.vm

3。布局测试

编写测试布局文件default.vm放置于上述配置中的默认布局文件存放路径中，内容如下

 
<html>
 
<head>
 
  <title>$!page_title</title>
 
</head>
 
<body>
 
  $screen_content
 
</body>
 
</html>

上面源码中$screen_content便是VelocityLayoutServlet保留的关键字，Velocity依此关键字来潜入实际被引用的页面内容，其他变量开发者可以灵活处理。

另编写测试页面test.vm存放于web根目录下，内容如下

 
#set($page_title="Layout Test")
 
Hello Velocity Layout!

启动服务器，测试该页面输出的HTML内容如下：

 
<html>
 
<head>
 
  <title>Layout Test</title>
 
</head>
 
<body>
 
  Hello Velocity Layout!
 
</body>
 
</html>

如此便达到我们预期的效果，如何使用便是听凭各位发落：）

参考资料：

http://jakarta.apache.org/velocity/tools/view/layoutservlet.html

psiitoy

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
Velocity布局祥解

大多数网站的每个页面布局差别不是太大，除非一些特殊页面例如门户首页等。如果每个页面独立一个文件，则会导致不同文件出现大量相同的代码，我们也可以把这些相同的代码抽取出来放在一个独立的小文件，需要的时候利用 Velocity的#parse指令来嵌入到目标页面中。但是此法却对页面上用于控制排版的HTML代码无效，因为控制整个页面排版的代码一般会贯穿整个文件，开头、结尾皆有，无法分拆到独立的文件上，因
复制链接

扫一扫

专栏目录