Mobile Framework:简约不简单的移动开发框架Lettuce

移动开发
Lettuce是一个小巧而有力的移动开发框架。本文简要介绍了Lettuce的示例,并放出了代码供大家下载使用。

Lettuce是一个小巧而有力的移动开发框架。

在线demo:http://phodal.github.io/lettuce.

示例

1.新建实例

  1. var L = new lettuce(); 

2.定义数据

  1. var data = { 
  2.     about: "Template"
  3.     what: "This about A Mobile Framework For Romantic"
  4.     why: "Why is a new Framework" 
  5. }; 

3.创建router功能

  1. function about() { 
  2.     var result = L.tmpl("<h3>{%=o.about%}</h3>", data); 
  3.     document.getElementById("results").innerHTML = result; 
  4. }; 
  5.  
  6. function what() { 
  7.     var result = L.tmpl("<h3>{%=o.what%}</h3>", data); 
  8.     document.getElementById("results").innerHTML = result; 
  9.  
  10. function why() { 
  11.     var result = L.tmpl("<h3>{%=o.why%}</h3>", data); 
  12.     document.getElementById("results").innerHTML = result; 

4.添加router

  1. L.Router 
  2.     .add(/#about/, about) 
  3.     .add(/#what/, what) 
  4.     .add(/#why/, why) 
  5.     .load(); 

过程

Done

  • Template
  • Router
  • Ajax
  • Class
  • Promise
  • Event

On Going

  • Model

简单视图

  1. var pageView = function(){}; 
  2. pageView.prototype = { 
  3.     init:function(){ 
  4.         var result = L.tmpl("<h3>" + this.message + "</h3>", data); 
  5.         document.getElementById("results").innerHTML = result; 
  6.     } 
  7. }; 
  8.  
  9. var about = new L.Class(pageView); 
  10. about.prototype.message = data.about; 
  11.  
  12. var what = new L.Class(pageView); 
  13. what.prototype.message = data.what; 
  14.  
  15. var why = new L.Class(pageView); 
  16. why.prototype.message = data.why; 

许可

此代码是在MIT许可下发布。看到这个目录license.txt

github:https://github.com/phodal/lettuce

© 2015 Phodal Huang.

责任编辑:林师授 来源: GitHub
相关推荐

2015-01-12 10:28:58

移动开发框架LettuceMobile Fram

2009-07-20 10:06:47

虚拟化思杰操作系统

2013-06-04 17:10:00

Linux命令

2011-12-28 15:11:09

iOS推荐

2014-08-21 10:14:09

APP界面设计移动客户端

2012-10-18 13:26:03

多米音乐华为

2010-08-06 09:07:23

FlexFlex开源项目

2020-12-21 10:55:41

Linux系统ls命令

2011-04-29 15:04:16

惠普OMNI100

2012-05-08 16:27:07

乌邦果

2010-06-07 14:54:30

惠普迷你工作站评测

2010-12-02 17:48:02

Windows Pho

2012-04-13 10:16:32

2014-09-18 10:43:32

jquery mobi

2010-03-30 14:06:35

2011-05-07 10:25:26

佳能MP498一体机评测

2014-12-19 10:07:10

C

2011-09-05 13:45:25

jQuery MobiSencha Touc移动Web UI框架

2022-03-16 22:24:50

ReactstateHooks

2012-06-26 09:40:14

部署开发管理
点赞
收藏

51CTO技术栈公众号