基於jeesite的cms系統（四）：使用Beetl模版引擎在后端渲染數據

一、Beetl簡介

1. 什么是Beetl

Beetl目前版本是2.9.3,相對於其他java模板引擎，具有功能齊全，語法直觀,性能超高，以及編寫的模板容易維護等特點。使得開發和維護模板有很好的體驗。是新一代的模板引擎。總得來說，它的特性如下：

• 功能完備：作為主流模板引擎，Beetl具有相當多的功能和其他模板引擎不具備的功能。適用於各種應用場景，從對響應速度有很高要求的大網站到功能繁多的CMS管理系統都適合。Beetl本身還具有很多獨特功能來完成模板編寫和維護，這是其他模板引擎所不具有的。
• 非常簡單：類似Javascript語法和習俗，只要半小時就能通過半學半猜完全掌握用法。拒絕其他模板引擎那種非人性化的語法和習俗。同時也能支持html 標簽，使得開發CMS系統比較容易
• 超高的性能：Beetl 遠超過主流java模板引擎性能(引擎性能5-6倍於FreeMarker，2倍於JSP。參考附錄），而且消耗較低的CPU。
• 易於整合：Beetl能很容易的與各種web框架整合，如Spring MVC，JFinal，Struts，Nutz，Jodd，Servlet等。
• 支持模板單獨開發和測試，即在MVC架構中，即使沒有M和C部分，也能開發和測試模板。
• 擴展和個性化：Beetl支持自定義方法，格式化函數，虛擬屬性，標簽，和HTML標簽. 同時Beetl也支持自定義占位符和控制語句起始符號也支持使用者完全可以打造適合自己的工具包。
• 可以擴展為腳本引擎，規則引擎，能定制引擎從而實現高級功能。

2.文檔（http://ibeetl.com/guide/）

 

二、ArticleController返回帶有beetl標簽的html視圖用來解析“articles”屬性

/**
     * 首頁內容（獲取top15文章）
     * @param
     * @return
     *//*
    @GetMapping(value = "/index")
    public String index(Model model) throws Exception {
        List<JsCmsArticlesEntity> articles = this.frontDeskService.getTop15Articles();
        model.addAttribute("articles", articles);
        return "templates/index";
    }

 

三、index.html

1、<% layout('default.html'){ }%>是頁面公共部分，可以實現多個html公用

2、<% for(article in articles){ %> 通過for循環遍歷aticles集合，然后用“.”操作${article.createAt}取值

<% layout('default.html'){ %>
<div class="main">

    <div class="article__wrap" id="article__">
    <%
    //ajax片段開始
    #ajax nextTable: {
    %>

    <% for(article in articles){ %>
    <article id="article" class="article__item fn-flex">
        <!--<div class="article__meta article__meta&#45;&#45;0">

            <div>
                ${article.createAt}
            </div>
            <div>
                <a href="electron-bnd2-b3id=H9oxzSym.html">
                    ${article.viewCount}瀏覽
                </a>
            </div>

            <div>
                <a href="electron-bnd2-b3id=H9oxzSym.html#pipeComments">
                    ${article.commentCount}評論
                </a>
            </div>


        </div>-->
        <div class="fn-flex-1 article__main">
            <h2 class="article__title">

                <a rel="bookmark" href="/articles/${article.id!}">
                    ${article.title}
                </a>
            </h2>

            <section
                    data-link="electron-bnd2-b3id=H9oxzSym.html"
                    class="pipe-content__reset fn-flex-1"
                    data-author="Vanessa">
                ${article.content}
            </section>

            <div>

                <a class="tag" rel="tag" href="tags/bnd2-b3id=H9oxzSym.html">${article.tags}</a>

            </div>
        </div>
    </article>
    <% } %>

    <%
    //ajax片段結尾
    }
    %>
</div>

    <div class="ft-center">
    <nav class="pagination">

        <a class="pagination__item" id="loadMore"
           href="javascript:void(0);">
            加載更多
        </a>
        
    </nav>
</div>

</div>

<% } %>