Mobile Framework:簡(jiǎn)約不簡(jiǎn)單的移動(dòng)開發(fā)框架Lettuce
譯文作者:51CTO閆佳明譯
Lettuce是一個(gè)小巧而有力的移動(dòng)開發(fā)框架。本文簡(jiǎn)要介紹了Lettuce的示例,并放出了代碼供大家下載使用。
Lettuce是一個(gè)小巧而有力的移動(dòng)開發(fā)框架。
在線demo:http://phodal.github.io/lettuce.
示例
1.新建實(shí)例
- var L = new lettuce();
2.定義數(shù)據(jù)
- var data = {
- about: "Template",
- what: "This about A Mobile Framework For Romantic",
- why: "Why is a new Framework"
- };
3.創(chuàng)建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
簡(jiǎn)單視圖
- 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許可下發(fā)布。看到這個(gè)目錄license.txt。
github:https://github.com/phodal/lettuce
© 2015 Phodal Huang.
責(zé)任編輯:閆佳明
來(lái)源:
GitHub