第六節(jié) Hasor 裝飾器

2018-10-09 15:46 更新

裝飾器是 Hasor 的 Web 開發(fā)框架中極具特色的一項功能。它的使用場景是這樣的，當(dāng)你很多頁面都有著共同的布局結(jié)構(gòu)時，就可以使用 Hasor 的裝飾器。如果您接觸過或者了解 Sitemesh 框架，應(yīng)該對 Hasor 的裝飾器不會臺陌生。它們要做的事情是一樣的，都是為了給項目提供 ‘母版頁’技術(shù)。只不過 Hasor 的裝飾器不像 Sitemesh 把裝飾功能單獨做成了一個框架。


它的工作原理是一個典型的實踐 裝飾器模式 一個啟用了裝飾器的站點在渲染其頁面時，會先渲染目標(biāo)頁面到一個臨時的緩沖區(qū)。然后會再次渲染布局模板文件，這個時候預(yù)先渲染的頁面就會被安插到指定的位置上。


在 Hasor 中布局模板文件只會有一個生效， Hasor 不支持嵌套的布局模板。如果您要在布局模板中再次提煉公共布局模板，您需要做的是將布局模板文件的內(nèi)容模塊化。而不是套用嵌套布局。


默認(rèn)情況下，Hasor 的裝飾器是關(guān)閉的。如果您需要啟用裝飾器，那么需要您在 hasor-config.xml 中設(shè)置環(huán)境變量以啟用它。


<!-- 啟用站點文件布局 -->
<HASOR_RESTFUL_LAYOUT>true</HASOR_RESTFUL_LAYOUT>


啟用了站點布局之后，您的整個 webapp 目錄中的文件必須按照固定的目錄格式進(jìn)行編排。一個合法的站點目錄應(yīng)該是這個樣子的：


webapps/
    layout/     布局模板
    templates/  頁面模板
    WEB-INF/    web.xml


所有訪問網(wǎng)站的頁面模板文件統(tǒng)一移動到 templates 目錄下，另外 layout 目錄用于保存模板頁。


接下來，我們用一個例子來說明 Hasor 的裝飾器如何使用。我們的例子中要求所有網(wǎng)頁都統(tǒng)一加上一個頁腳。


首先創(chuàng)建我們的模版頁，用來確定頁面最終的結(jié)構(gòu)，同時我們把頁腳加入進(jìn)去。


<!DOCTYPE html>
<html lang="cn">
<head>
    <title>${rootData.pageTitle!}</title>
</head>
<body>

${content_placeholder!}

<div>this is foot</div>
</body>
</html>


上面這個頁面代碼使用的是 Freemarker 語法編寫，其中 content_placeholder 表示的是用戶實際訪問的目標(biāo)頁面 target。在模板頁中您可以根據(jù)自己的實際需要選擇輸出在母版頁中任何一個位置上。


rootData是請求處理器用于保存數(shù)據(jù)的全局對象，其作用范圍是 request。我們通過 Invoker 接口寫入的所有數(shù)據(jù)在 rootData 對象中都可以找到。通過它我們可以實現(xiàn)在 子頁面中設(shè)置頁面的 title ，然后在母版頁中將 title 數(shù)據(jù)取出。下面這個就是具體的目標(biāo)頁：

${rootData.put('pageTitle','首頁')}
<style>
    .rightBorder {
        border-right: thick dashed #cfcfcf;
    }
</style>

this page form user
<div>this is foot</div>


我們可以看到具體的頁面中，沒有看到 body、html 這些元素。這是因為， Hasor 的裝飾器在執(zhí)行時僅僅做了一次 content_placeholder 的代入。


模板的文件名默認(rèn)情況下統(tǒng)一為：default，您可以在 layout 目錄中新建子目錄來存放其它模板。


您實際訪問的頁面在進(jìn)行模板頁面渲染時會自動增加 templates 前綴以正確映射到站點布局中。


以上內(nèi)容是否對您有幫助：
在線筆記
App下載
App下載

掃描二維碼

下載編程獅App

公眾號
微信公眾號

編程獅公眾號