SpringMVC 學習-如何搭配使用 Velocity 頁面模板

1、快速搭建 Velocity 框架

 

1. 加入所需 Jar 包

<dependency>
    <groupId>org.apache.velocity</groupId>
    <artifactId>velocity</artifactId>
    <version>1.7</version>
</dependency>
<dependency>
    <groupId>velocity-tools</groupId>
    <artifactId>velocity-tools-generic</artifactId>
    <version>2.0-beta1</version>
</dependency>
<dependency>
    <groupId>velocity-tools</groupId>
    <artifactId>velocity-tools-view</artifactId>
    <version>2.0-beta1</version>
</dependency>
<dependency>
    <groupId>commons-digester</groupId>
    <artifactId>commons-digester</artifactId>
    <version>2.1</version>
</dependency>

 

2. 修改 SpringMVC 的配置文件 springmvc-servlet.xml

舊配置：

<!-- 對加載頁面的路徑解析 -->
<bean id="viewResolver" class="org.springframework.web.servlet.view.InternalResourceViewResolver">
　　<!-- 前綴 -->
　　<property name="prefix" value="/"></property>
　　<!-- 後綴 -->
　　<property name="suffix" value=".html"></property>
</bean>

改成：

<!-- 對加載頁面的路徑解析 不須要配 prefix， 在 velocity-servlet.xml 中配置 -->
<bean id="viewResolver" class="org.springframework.web.servlet.view.velocity.VelocityViewResolver">
　　<!-- 加載 toolbox 配置文件 -->
　　<property name="toolboxConfigLocation" value="/WEB-INF/velocityToolBox.xml" />
　　<!-- 後綴 -->
　　<property name="suffix" value=".vm"></property>
</bean>

 

3. 在 WEB-INF 下面建立配置文件，命名爲 velocityToolBox.xml 

<toolbox>
　　<!-- application start -->
　　<tool>
　　　　<key>date</key>
       <scope>application</scope>
       <class>org.apache.velocity.tools.generic.DateTool</class>
　　</tool>
　　<tool>
       <key>math</key>
       <scope>application</scope>
　　　　<class>org.apache.velocity.tools.generic.MathTool</class>
　　</tool>
　　<!-- application end -->
</toolbox>

 

4. 在 WEB-INF 下建立配置文件 velocity-servlet.xml 

<bean id="velocityConfigurer"
        class="org.springframework.web.servlet.view.velocity.VelocityConfigurer">
　　<!-- 模版路徑 -->
　　<property name="resourceLoaderPath">
　　　　<!-- prefix -->
　　　　<value>/</value>
　　</property>
　　<!-- 模版屬性 -->
　　<property name="velocityProperties">
　　　　<props>
　　　　　　<prop key="input.encoding">utf-8</prop>
　　　　　　<prop key="output.encoding">utf-8</prop>
　　　　</props>
　　</property>
</bean>

記得在 web.xml 文件中引入 velocity-servlet.xml 

 

5. velocity 模板的一些基本指令

好比循環：後臺傳遞過來的用戶信息列表 userList 

#foreach($item in $userList)
    <div>$item.userName $item.createDate</div>
#end

 

二. 如何自定義標籤

 

1. 先建立一個自定義標籤 Java 類。必需要有 @DefaultKey("") 註解

package com.erim.web.common;

@DefaultKey("erim")
public class ErimTag {
　　// 格式化時間
    public String formatDate(Date date) {
        return new SimpleDateFormat("yyyy-MM-dd HH:mm:ss").format(date);
    }
}

 

2. 修改 WEB-INF 下 velocityToolBox.xml 引入 Java 類

<tool>
    <key>erim</key>
    <scope>application</scope>
    <class>com.erim.web.common.ErimTag</class>
</tool>

這樣自定義註解就生效了。假如後臺有一個時間變量 createDate 須要在頁面渲染，渲染完發現格式是醬紫的：

Thu May 12 15:20:02 CST 2016

這就須要用到咱們的自定義標籤：

$erim.formatDate($createDate)

 

三. 如何自定義指令

 

1. 仍是先建立一個 Java 類，繼承 Directive。

public class TextTag extends Directive {

    @Override
    public String getName() {
        return "vText";
    }

    @Override
    public int getType() {
        return LINE;
    }

    @Override
    public boolean render(InternalContextAdapter context, Writer writer, Node node)
            throws IOException, ResourceNotFoundException, ParseErrorException,
            MethodInvocationException {
        // 獲取第一個參數
        SimpleNode user = (SimpleNode) node.jjtGetChild(0);
        // 格式化
        String userName = (String) user.value(context);
        // 操做
        userName = userName + ".....";
        // 輸出
        writer.write(userName);
        return true;
    }

}

 

2. 在 WEB-INF 下建立資源文件 velocity.properties

input.encoding=utf-8   
output.encoding=utf-8 
userdirective=com.erim.web.common.TextTag

其中 userdirective 的值爲自定義指令 Java 類的地址，多個 Java 類以逗號分隔

 

3. 修改 velocity-servlet.xml 文件

<!-- velocity 相關配置 -->
<bean id="velocityConfigurer" 
　　class="org.springframework.web.servlet.view.velocity.VelocityConfigurer">
　　<!-- 引入外部資源 -->
　　<property name="configLocation" value="/WEB-INF/velocity.properties" />
　　<!-- 模板路徑 -->
　　<property name="resourceLoaderPath" value="/templates/"></property>
　　<!-- 模板屬性 -->
　　<property name="velocityProperties">
　　　　<props>
　　　　　　<prop key="input.encoding">utf-8</prop>
　　　　　　<prop key="output.encoding">utf-8</prop>
　　　　</props>
　　</property>
</bean>

 

4. 使用場景

#vText("hhahaha")

hahahha， demo 就是這麼任意

#vText 就是上面 getName() 方法中指定的字符串。