一分钟上手artTemplate
来源:互联网 发布:阿里云到底是干嘛的 编辑:程序博客网 时间:2024/05/21 21:51
一分钟上手artTemplate
artTemplate是腾讯开源的前端模版引擎。之前做hue二次开发,只接触过用python写的mako模版引擎,所以之前对前端模版引擎了解不是很多。
这次因为pm叫我快速做一个demo放到阿里云给客户看。页面交互也不复杂,就想用拼接字符串来动态加载后台数据,好快点交差。结果pm一句“你先做着,交互和ui改好再给你”,我“qnmd”。。。。。
拼接字符串还是算了,就去github找到了这款星星最多的arttemplate。
废话不多说,一分钟上手
一个简单的例子(原生语法):
<!--用于展示模版的位置--><div id="area"></div> <script src="js/template-native.js"></script><!--用于存放模版--><script id="template" type="text/html"> <div> <% for(i=0;i<content.length;++i) {%> <h1><%=content[i].province%></h1> <% for(j=0 ; j<content[i].city.length ; ++j){%> <p><%=content[i].city[j]%></p> <%}%> <%}%> </div></script><!--用于渲染模版--><script> var data={ content:[ {province:'四川',city:['成都','绵阳','自贡']}, {province:'广东',city:['广州','东莞','佛山']}, {province:'海南',city:['海口','三亚']} ] }; var html=template('template',data); document.getElementById('area').innerHTML=html</script>
总结:
art template语法分为两种:一种是原生语法,一种是简洁语法,我觉得原生更好理解,只是加个<%%>,其他和写js没什么区别
当模版引擎解析到<%%>时,会把其中的字符串作为js代码来执行,当<%%>中紧跟 “=” 则会输出变量
每个模版引擎都包含:语法、变量赋值、动态解析js字符串,只是实现方式不同。个人认为模版引擎的性能取决于他的解析方式。
- 官网下载地址:https://github.com/aui/artTemplate#%E4%B8%8B%E8%BD%BD
0 0
- 一分钟上手artTemplate
- Git一分钟上手
- Git一分钟上手
- Git一分钟上手
- Git一分钟上手技巧
- 一分钟上手bootstrap table
- Java编程者一分钟上手Scala
- F# 20分钟快速上手(一)
- 一分钟上手SpringMVC(思维图)
- artTemplate十分钟快速入手
- js模板引擎artTemplate快速上手
- artTemplate新手入门(一)
- 简单实用一分钟上手级权限控制
- Toolbar快速实现,让你一分钟上手
- ECharts官方教程(一)【5分钟上手ECharts】
- Subversion 十分钟上手
- 5 分钟上手 Tmux
- 五分钟上手Git
- java中HashMap详解
- java中的异常类型与处理方法
- HashMap深度解析(一)
- iOS 【Multithreading-栅栏函数/快速迭代(剪切图片)/队列组(图片水印)】
- 【MyBatis框架】Mybatis开发dao方法第二部分
- 一分钟上手artTemplate
- React Native UI布局总结
- Qt中使用WMI时遇到的那些坑儿
- C++中的friend友元函数详细解析
- 防止僵尸进程的fork编程
- github 常用命令
- cocos2dx 实习生培训计划
- leetcode题解日练--2016.7.10
- 多项式求根