模板引擎--artTemplate小实例

artTemplate是腾讯开源的前端模板框架，性能卓越，简单易学

下载：https://github.com/aui/artTemplate

简单数据遍历实例：

无论数组或者对象都可以用 each 进行遍历

语法：

{{each list as value index}}  //开始
   

{{index}} - {{value.user}}

{{/each}}//结束

准备代码：

data.json --这是需要遍历的数据文件

{
    "list": [
        {
            "age": 25,
            "createTime": {"date": 23,"day": 2,"hours": 0,"minutes": 0,"month": 6,"seconds": 0,"time": 1563811200000,"timezoneOffset": -480,"year": 119},
            "moblePhone": "183****8280",
            "userName": "张国立"
        },
        {
            "age": 24,
            "createTime": {"date": 23,"day": 2,"hours": 0,"minutes": 0,"month": 6,"seconds": 0,"time": 1563811200000,"timezoneOffset": -480,"year": 119},
            "moblePhone": "183****8280",
            "userName": "张铁林"
        },
        {
            "age": 22,
             "createTime": {"date": 23,"day": 2,"hours": 0,"minutes": 0,"month": 6,"seconds": 0,"time": 1563811200000,"timezoneOffset": -480,"year": 119},
            "moblePhone": "183****8280",
            "passWord": "1234",
            "userName": "邓婕"
        },
        {
            "age": 22,
            "createTime": {"date": 23,"day": 2,"hours": 0,"minutes": 0,"month": 6,"seconds": 0,"time": 1563811200000,"timezoneOffset": -480,"year": 119},
            "moblePhone": "183****8280",
            "passWord": "1234",
            "userName": "吳亦凡"
        },
        {
            "age": 22,
            "createTime": {"date": 23,"day": 2,"hours": 0,"minutes": 0,"month": 6,"seconds": 0,"time": 1563811200000,"timezoneOffset": -480,"year": 119},
            "moblePhone": "183****8280",
            "userName": "郭德纲"
        },
        {
            "age": 22,
            "createTime": {"date": 23,"day": 2,"hours": 0,"minutes": 0,"month": 6,"seconds": 0,"time": 1563811200000,"timezoneOffset": -480,"year": 119},
            "moblePhone": "183****8280",
            "passWord": "1234",
            "userName": "彭于晏"
        }
       
    ]
}

页面： 

    
    
    
    
    



    

        

        

            
账号
            
年龄
            
手机号
            
创建日期
            
操作
        
        
        


        
    

效果：