码迷,mamicode.com
首页 > 其他好文 > 详细

layui模板引擎如何使用第一季

时间:2020-07-22 16:24:25      阅读:91      评论:0      收藏:0      [点我收藏+]

标签:on()   str   ons   大量   异常   解析   编写   cti   html   

laytpl 是 JavScript 模板引擎,在字符解析上有着比较出色的表现,欠缺之处在于异常调试上。由于传统意义的前端模板引擎已经变得不再流行,所以 laytpl 后续可能会进行重写,目前方向暂时还没有想好,预计会在layui比较稳定后开始实施。

快速使用

  与一般的字符拼接不同的是,laytpl 的模板可与数据分离,集中把逻辑处理放在 View 层,提升代码可维护性,尤其是针对大量模板渲染的情况。

layui模板引擎如何使用代码块
layui.use(‘laytpl‘, function(){
var laytpl = layui.laytpl;//直接解析字符
laytpl(‘{{ d.name }}是一位公猿‘).render({
name: ‘贤心‘
}, function(string){
console.log(string); //贤心是一位公猿
});
//你也可以采用下述同步写法,将 render 方法的回调函数剔除,可直接返回渲染好的字符
var string = laytpl(‘{{ d.name }}是一位公猿‘).render({
name: ‘贤心‘
});
console.log(string);
//贤心是一位公猿
//如果模板较大,你也可以采用数据的写法,这样会比较直观一些
laytpl([
‘{{ d.name }}是一位公猿‘,
‘其它字符 {{ d.content }} 其它字符‘
].join(‘‘))
});
  你也可以将模板存储在页面或其它任意位置:

layui模板引擎如何使用代码块
//第一步:编写模版。你可以使用一个script标签存放模板,如:

//第二步:建立视图。用于呈现渲染结果。

//第三步:渲染模版 var data = { //数据"title":"Layui常用模块","list":[{"modname":"弹层","alias":"layer","site":"layer.layui.com"},{"modname":"表单","alias":"form"}]} var getTpl = demo.innerHTML, view = document.getElementById(‘view‘); laytpl(getTpl).render(data, function(html){view.innerHTML = html;}); 模板语法
语法 说明 示例
{{ d.field }} 输出一个普通字段,不转义html
layui模板引擎如何使用代码块

{{ d.content }}
{{= d.field }} 输出一个普通字段,并转义html layui模板引擎如何使用代码块

layui模板引擎如何使用第一季

标签:on()   str   ons   大量   异常   解析   编写   cti   html   

原文地址:https://www.cnblogs.com/optic/p/13360587.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!