当前位置:首页 > 开发 > 行业应用 > 正文

doT js模板引擎 使用自定义函数进行渲染的两种方法

发表于: 2016-05-14   作者:qiaolevip   来源:转载   浏览:
摘要: doT模板是一款js渲染模板引擎,速度快,文件小,渲染效果良好而著称。官网-Logo,点击进入: 更多丰富js模板引擎,猛击:https://qiaolevip.github.io/frontend-template-engines/ doT模板Example:https://qiaolevip.github.io/frontend-template-engines/doT.html 解决方案1(

doT模板是一款js渲染模板引擎,速度快,文件小,渲染效果良好而著称。

官网-Logo,点击进入:

doT js模板引擎 使用自定义函数进行渲染的两种方法_第1张图片

 

更多丰富js模板引擎,猛击:https://qiaolevip.github.io/frontend-template-engines/

 

doT模板Example:https://qiaolevip.github.io/frontend-template-engines/doT.html

 

解决方案1(原生js Fn):

// 定义js函数
var maskText = function(text) {
  return text.replace(/(^.).*/g, '$1XXX');
};

// 模板引擎渲染
<div class="line">{{=maskText(it.top10[i-1].username)}}</div>

 

 

解决方案2(模板js Fn):

// 模板里面定义函数
{{##def.maskText = function() {return '我在这里'}#}}

// 模板里面使用函数
{{#def.maskText()}}

 

更多模板传参函数调用:

// 自定义函数
{{##def.testFunctionWithParam = function(str) {
		return "My name is: " + str;
	}
#}}

// 使用自定义函数一
{{##def.mytestparam: {{=it.name}} #}}
{{#def.testFunctionWithParam(def.mytestparam)}}

// 使用自定义函数二
{{#def.testFunctionWithParam("\{\{=it.name\}\}")}}

// 自定义函数
{{##def.testParamDef:myparam:
My name is: {{=myparam}}
#}}

{{#def.testParamDef:it.name}}

 



有疑问或技术交流,扫描公众号一起讨论学习。

更多React在线学习访问:http://each.sinaapp.com/react/index.html

doT js模板引擎 使用自定义函数进行渲染的两种方法_第2张图片

doT js模板引擎 使用自定义函数进行渲染的两种方法

  • 0

    开心

    开心

  • 0

    板砖

    板砖

  • 0

    感动

    感动

  • 0

    有用

    有用

  • 0

    疑问

    疑问

  • 0

    难过

    难过

  • 0

    无聊

    无聊

  • 0

    震惊

    震惊

编辑推荐
doT.js github地址: doT.js 官方网站 实例1:简单 <!DOCTYPE html> <html lang="en"> &l
doT js 宏的使用 <script id="serviceItemTemplate" type="text/x-dot-template"> {{##def.sp
doT js 宏的使用 <script id="serviceItemTemplate" type="text/x-dot-template"> {{##def.sp
doT js 宏的使用 <script id="serviceItemTemplate" type="text/x-dot-template"> {{##def.sp
doT js 宏的使用 <script id="serviceItemTemplate" type="text/x-dot-template"> {{##def.sp
doT js 宏的使用 <script id="serviceItemTemplate" type="text/x-dot-template"> {{##def.sp
【方法1】举例介绍 Visual Studio 项目模板制作 项目模板的创建非常简单,我们只需要将希望作为项目
8 doT JS
1doT.js github地址: http://olado.github.io/doT/ 实例1:简单 <!DOCTYPE html> <html lan
9 doT JS
1doT.js github地址: http://olado.github.io/doT/ 实例1:简单 <!DOCTYPE html> <html lan
10 doT JS
1doT.js github地址: http://olado.github.io/doT/ 实例1:简单 <!DOCTYPE html> <html lan
版权所有 IT知识库 CopyRight © 2009-2015 IT知识库 IT610.com , All Rights Reserved. 京ICP备09083238号