WebX实践指南_页面模板(二)

正如前面所讲的，WebX中View使用Velocity模板引擎来实现的。

Velocity

Velocity是一个基于Java的模板引擎，它可以让视图的设计者在web页面中引用java代码中定义的数据对象和命令，从而实现真正意义上的MVC模式，保证了系统长期可维护性。下面简单地介绍下，Velocity的使用，关于Velocity的更详细介绍参考：http://velocity.apache.org/engine/devel

Velocity中语句都是#开头的，变量的定义都是$开头的
注释代码：## #* *#
模板的引用： #include() #parse()

变量

变量定义和使用

    定义：#set($a="velocity")
    使用：$a $!a

变量名规范：字母开头，中间可以由下划线、连接符或者数字组成
!的作用是,为空的时候输出为空；如果不加velocity莫波引擎不会解析空的变量

    变量的属性: $customer.Address $customer.name #set($customer.name="liujiajie")
    变量的方法: $customer.getAddress() $customer.getName()

对变量属性的操作间接使用了对象的get/set方法

Q： Velocity模板变量都是$开头的，如何输出$var这样的字符？
A： 使用\转义, #set($var="hello"); \$var=$var,对应的$var=hello

Q: 单引号双引号区别？
A: 单引号里的变量不会被解析。#literal() … #end可以用与一段代码的中，这样引擎也不会解析其中的内容。

变量类型

数组: {"A", "B", "C"} 访问.get(0)
Map: {"key1":"val1", "key2":"val2"}  
串: 连字符 $firstname$secondname

内置变量

[1..2] //range操作

变量操作

#set($id=1)
#set($id=$id+1)

语句

• foreach

 #foreach( $name in $names)
     #if($name)
     #elseif()
     #end
 #end

• if elseif else end
  逻辑的与或非 ! && ||
• stop
  #stop 用于停止模板解析
• macro
  定义宏 #macro(d) #end, 使用宏的时候 #d()
  当然宏中可以传递参数 #macro(tablerows $color$somelist)

关于更多Velocity的内容参照官网的介绍，这里的说明基本上能满足常见的业务处理，后续会针对Velocity模板的处理做专题的说明。

Velocity结合Html/CSS/JS

在实际的使用中，Velocity语法都是嵌入到HTML/CSS/JS文件中，其作用主要是实现动态数据的渲染控制。例如，典型的Table表处理时，对数据的渲染：

<table border="1">
  <tr>
    <th>Month</th>
    <th>Savings</th>
  </tr>
  #foreach($item in $items)
  <tr>
    <td>$item.month</td>
    <td>$item.savings</td>
  </tr>
  #end
</table>

WebX中的扩展

WebX中能够很好地支持Velocity模板引擎，同时添加了很多的服务支持，这里主要介绍page服务和url服务 。在webx-component.xml文件中有相关的配置：

<!-- 将beans暴露给模板。 -->
<services:pull>
    <pull-factories:utils />
    <pull-factories:rundata-tool />
    <pull-factories:csrfToken />
    <pull-factories:form-tool />
    <pull-factories:control-tool />
    <pull-factories:uris-tool />
</services:pull>

这方面的资料比较少，后续用到的时候再补全

page

$page的处理, web.xml page-tool用于处理$page对象
常见的使用方法：

$page.setTitle("")

uri

在示例程序中会看到:

#set($url = "$app1Link.setTarget('simple/download.do').addQueryData('filename', 'blob')")
<a href="$url">$url</a>

这里的$app1Link是哪里来的？又有啥作用？现在可以明确的是app1Link这个变量肯定不是velocity模板提供的，grep命令看一下，找到对应的代码在uris.xml文件中配置的。仔细看之后发现这里实际上是使用了URIBrokerService。

UriBrokerService简介

Web由有许多资源组成，比如HTML文档，图片，视频， css/javascript等。每一种资源都由一种叫做资源标示符（URI）的符号来定位。URI除了出现在Web页面上，对于程序员来说，有时也会将它作为字面值常量定义在程序当中。

这类静态录入的URI，在早期的系统开发过程中，的确让程序员屡试不爽。但随着系统功能的不断扩充，复杂性越来越高，静态录入URI使得整套系统变得难以扩展和维护。为了有效解决静态录入URI带来的维护和扩展性问题，URIBroker Service应运而生。

URIBroker Service的特点是以统一的配置和动态渲染的方式来生成URI字符串。在系统重构或移植时，你只需要修改URIBroker Service的统一配置文件 ,无需修改一行代码即可完成全系统URI的无缝迁移。URLBroker Service从本质上，解决了URI移植性，扩展性差等问题，同时也简化了开发人员的编码工作量。

Velocity模板中如何使用

常见的使用方式如下：

$applLink.setTarget("simple/download.do")
$applLink.setTarget("simple/download.do").addQueryData('filename', 'name')