Mobile Framework:簡約不簡單的移動開發框架Lettuce

jopen 9年前發布 | 8K 次閱讀 Lettuce

Lettuce是一個小巧而有力的移動開發框架。本文簡要介紹了Lettuce的示例,并放出了代碼供大家下載使用。

Lettuce是一個小巧而有力的移動開發框架。

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

示例

1.新建實例

    var L = new lettuce(); 

2.定義數據

    var data = { 
        about: "Template", 
        what: "This about A Mobile Framework For Romantic", 
        why: "Why is a new Framework" 
    }; 

3.創建router功能

    function about() { 
        var result = L.tmpl("<h3>{%=o.about%}</h3>", data); 
        document.getElementById("results").innerHTML = result; 
    }; 

    function what() { 
        var result = L.tmpl("<h3>{%=o.what%}</h3>", data); 
        document.getElementById("results").innerHTML = result; 
    } 

    function why() { 
        var result = L.tmpl("<h3>{%=o.why%}</h3>", data); 
        document.getElementById("results").innerHTML = result; 
    } 

4.添加router

    L.Router 
        .add(/#about/, about) 
        .add(/#what/, what) 
        .add(/#why/, why) 
        .load(); 


過程

Done

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

On Going

  • Model

簡單視圖

    var pageView = function(){}; 
    pageView.prototype = { 
        init:function(){ 
            var result = L.tmpl("<h3>" + this.message + "</h3>", data); 
            document.getElementById("results").innerHTML = result; 
        } 
    }; 

    var about = new L.Class(pageView); 
    about.prototype.message = data.about; 

    var what = new L.Class(pageView); 
    what.prototype.message = data.what; 

    var why = new L.Class(pageView); 
    why.prototype.message = data.why; 


許可

此代碼是在MIT許可下發布。看到這個目錄license.txt

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

? 2015 Phodal Huang.

 本文由用戶 jopen 自行上傳分享,僅供網友學習交流。所有權歸原作者,若您的權利被侵害,請聯系管理員。
 轉載本站原創文章,請注明出處,并保留原始鏈接、圖片水印。
 本站是一個以用戶分享為主的開源技術平臺,歡迎各類分享!