https://github.com/zanjs/tuma-js

https://github.com/zanjs/tuma-js

Last synced: 10 days ago
JSON representation

• Host: GitHub
• URL: https://github.com/zanjs/tuma-js
• Owner: zanjs
• Created: 2016-04-05T01:53:35.000Z (about 9 years ago)
• Default Branch: master
• Last Pushed: 2019-09-09T07:03:34.000Z (almost 6 years ago)
• Last Synced: 2025-06-12T04:23:43.195Z (18 days ago)
• Language: JavaScript
• Size: 251 KB
• Stars: 0
• Watchers: 1
• Forks: 0
• Open Issues: 1
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# tuma.js

极简高性能模板引擎

============

## Usage 使用方法

### 模板

```html

<ul>

  <% for(var i=0; i< list.length; i++){ %>

      <li> <%= list[i].name %> </li>

  <% } %>

</ul>

```

### 数据

```javascript

var list = [

    {id: 1, name: 'name1'},

    {id: 2, name: 'name2'},

    {id: 3, name: 'name3'}

]

```

### 渲染

```javascript

var tpl = document.getElementById('test').innerHTML;

var render = tuma.tmpl(tpl); // 返回一个渲染函数

var result = render(); // 执行渲染得到结果

// 输出结果

document.getElementById('result').innerHTML = result;

```

```javascript

// 上面使用的是全局变量，这样并不太好。可以把需要的参数传入

var data = {

  list: {...},

  // ... 其它变量

}

var render = tuma.tmpl(tpl);

var result = render(data); // 传入参数

// ... 数据变化后，再次渲染

var result = render(data);

// 还可以这样写

var result = tuma.tmpl(tpl)(data);

// 或者这样

var result = tuma.tmpl(tpl, data);

```

### 结果

```html





  

      
 name1 

  

      
 name2 

  

      
 name3 

  





```


### test show

![](./test/test.png)