art-template@4.12.2?使用記錄
? ? 有些時(shí)間不用了,最近因?yàn)锳PP項(xiàng)目有兩個(gè)頁面需求想要由前端來分擔(dān)娘汞,主要是數(shù)據(jù)展示為主歹茶;大量的字段需要填,dom操作簡直要命价说,需要大量的id辆亏,class风秤,想想就惡心鳖目,那就直接懟模板吧;
引用art-template:? npm i art-template? 找到template-web.js文件引入
同時(shí)支持簡潔語法和原生語法
簡潔語法:直接用{{XX}}填坑
過濾器:{{XX |?過濾器名?參數(shù)1?參數(shù)2}}? ? 印象中原來使用中是使用:參數(shù)? ? ?此版本中使用空格隔開(控制臺(tái)看到的哈哈缤弦,不影響使用领迈,懶得改)
自定義過濾器方法:template.defaults.imports.過濾器名 =?function(){}? 如下:
template.defaults.imports.starNum = function(data){
? ? ?var str = '';
? ? ?$(data).each(function(i, v){
? ? ? ? ? str += v+'、';
? ? ?})
? ? ?str = str.slice(0,-1);
? ? ?return str;
}
{{#XX}}? 這里#號(hào)表示原文輸出碍沐,返回內(nèi)容包含html標(biāo)簽時(shí)使用狸捅,現(xiàn)在#改成@了貌似。(控制臺(tái)提示累提,不影響使用尘喝,懶得改)
簡潔語法還有? each循環(huán)? $value表示循環(huán)內(nèi)的每個(gè)元素? 還有$index表示索引?這次沒用斋陪,忘了
if條件判斷?這里沒用朽褪,不提也罷。
原生語法支持js的形式? <% 表達(dá)式? %>? ? <%=? 輸出值 %>? 略略略无虚。缔赠。。友题。嗤堰。
這個(gè)頁面過于簡單,沒有過多的使用art-template的功能度宦,但無非就以上提到的常用的方法踢匣,復(fù)雜的時(shí)候度娘唄。腦子不好使戈抄,記呀記不住~曾經(jīng)用過handlebars,基礎(chǔ)用法都差不多符糊,個(gè)人還是偏好這個(gè)模板引擎。