arttemplate與webpack的應用

2022-04-02 01:47:18 字數 795 閱讀 3399

模板渲染使用arttemplate,使用方法如下:

普通使用

普通使用把渲染模板寫在標籤裡面,引入arttemplate.js,從服務端接收資料(陣列與物件的形式),然後呼叫arttemplate提供的方法渲染。例如,可以直接呼叫template()方法(需要獲取html標籤的id);或者使用complie()先編譯模板,然後再傳入資料;或者使用render()方法直接編譯並傳入資料。生成的html內容直接賦值到乙個變數html,然後通過innerhtml方法把html內容寫進去。

webpack

和普通使用一樣,但是模板單獨寫在.tpl檔案,然後require()進來,用complie()方法編譯成函式,再傳入從服務端傳來的物件和陣列。同時安裝ejs-loader,用於識別.tpl字尾的檔案。

模板寫法如下:

模板tpl

}

}.}}

js渲染函式

//data是服務端傳來的資料

function htmlrender(data)

var html = render(obj);

$('items').html(html);

}htmlrender(data.content);

資料data

,,,

]}

art template模板引擎

1.模板語法 2.輸出 將某項資料輸出在模板中 3.原文輸出 如果資料中攜帶html標籤,預設模板引擎不會解析標籤,會將其轉義後輸出 4.條件判斷 在模板中可以根據條件來決定顯示哪塊html 5.迴圈 6.子模版 使用子模版可以將 公共區塊 頭部 底部 抽離到單獨的檔案中 7.模板繼承 使用模板繼承...

artTemplate模板引擎

使用乙個type text html 的script標籤存放模板 模板邏輯語法開始與結束的界定符號為 與 若 後面緊跟 號則輸出變數內容。template.render id,data var data var html template.render test data document.gete...

art template 模版引擎

模版引擎是第三方模組 可以讓開發著以更友好的方式拼接字串,使專案 更加清晰,更加易於維護。art template 模版引擎 使用命令列工具 輸入 npm i art template 進行安裝 使用const template require art template 引入模版引擎 告訴模版引擎要...