建站
咨詢
售后
建站咨詢
新聞中心
View
View使用handlebars組件作為模板引擎，handlebars語法請參考官網(wǎng)。
我們注重客戶提出的每個要求，我們充分考慮每一個細(xì)節(jié)，我們積極的做好成都網(wǎng)站設(shè)計、成都網(wǎng)站建設(shè)、外貿(mào)網(wǎng)站建設(shè)服務(wù)，我們努力開拓更好的視野，通過不懈的努力，創(chuàng)新互聯(lián)贏得了業(yè)內(nèi)的良好聲譽(yù)，這一切，也不斷的激勵著我們更好的服務(wù)客戶。 主要業(yè)務(wù)：網(wǎng)站建設(shè),網(wǎng)站制作,網(wǎng)站設(shè)計,微信小程序,網(wǎng)站開發(fā),技術(shù)開發(fā)實(shí)力，DIV+CSS，PHP及ASP，ASP.Net，SQL數(shù)據(jù)庫的技術(shù)開發(fā)工程師。
為了更快的開發(fā)視圖代碼，Clouda對handlebars的語法做了一些擴(kuò)展：
view中引入view
語法： {{> viewName}}在一個View中引用另一個View。
view中使用JS
語法： {{$ alert("data.length"); }}在View中直接執(zhí)行Javascript代碼，并將返回結(jié)果輸出在View中。
foreach
用于快速遍歷一個對象或數(shù)組
語法：{{#foreach}}{{/foreach}}用法示例：
- {{#foreach customObj}}
- {{key}} : {{value}}
- {{/foreach}}
compare
比較兩個對象
- 語法：
- {{#compare a operator b}}
- {{else}}
- {{/compare}}
可以使用的operator：
operator == === != !== < <= > >= typeof 用法示例：
- {{#compare a "<" b}}
- a < b
- {{else}}
- a >= b
- {{/compare}}
- {{#compare a "typeof" "undefined"}}
- undefined
- {{/compare}}
注意：當(dāng)省略operator時，系統(tǒng)默認(rèn)使用操作符 ==：
{{#compare 1 1}} 1 == 1 {{/compare}}sumeru.config.view.set
語法：sumeru.config.view.set('path', viewpath);一般情況下將編寫的view文件存放在app/view文件夾下，如果編寫的view文件不在View文件夾下，我們也提供View文件路徑配置的方法，框架會在配置路徑下尋找需要的View文件:
實(shí)例：
sumeru.config.view.set('path', 'path/to/');則Clouda會在如下目錄中加載視圖：
app目錄/path/to/view/注意:即使是修改viewpath的情況下，在最內(nèi)一側(cè)仍然需要有一層view文件夾，如上面路徑的最后部分。
#p#
Transition
當(dāng)場景發(fā)生轉(zhuǎn)換時，通過transition定義場景轉(zhuǎn)換效果。
doRender(viewName,transition)-
viewName
需要渲染View的名稱
-
transition
push
推出
-
方向
-
left
從左向右推出
-
right
從右向左推出
-
up
從上向下推出
-
down
從下向上推出
-
-
rotate
旋轉(zhuǎn)
-
方向
-
left
-
right
-
-
fade
漸變
-
方向
-
z-index
垂直方向
-
-
shake
退出場景時先縮小后放大退出，進(jìn)入場景從左或者右邊推入
-
方向
-
left
從左推入進(jìn)場
-
right
從右推入進(jìn)場
-
-
none
沒有轉(zhuǎn)場效果
-
方向參數(shù)
-
z
默認(rèn)參數(shù)
-
-
實(shí)例：
- env.onrender = function(doRender){
- doRender('student', ['push', 'down']);
- };
- env.onrender = function(doRender){
- doRender('student', ['none', 'z']);
- };
#p#
Controller
如果你曾經(jīng)接觸過MVC模型，那么將會很熟悉Controller的概念。在Clouda中，Controller是每個場景的控制器，負(fù)責(zé)實(shí)現(xiàn)App的核心業(yè)務(wù)邏輯。
create
語法：sumeru.controller.create(function(env,session){});創(chuàng)建一個Controller
App.studentList = sumeru.controller.create(function(env,session){});env
redirect
語法：env.redirect(queryPath,paramMap,isforce)一個Controller跳轉(zhuǎn)到另一個Controller
env.redirect('/studentList',{'class':'101'});-
queryPath
router中pattern的值
-
paramMap
需要向跳轉(zhuǎn)Controller傳遞的參數(shù) -
isforce
是否強(qiáng)制生成一個全新的Controller實(shí)例。
如果在redirect中使用paramMap，可以在跳轉(zhuǎn)目標(biāo)Controller的create()中"param"接受參數(shù)。
- App.studentList = sumeru.controller.create(function(evn,session,param){
- });
-
refresh
語法： env.refresh()重新加載當(dāng)前Controller
env.refresh();onload
語法：env.load()onload()是Controller的第一個時態(tài)，Controller中需要使用的數(shù)據(jù)都在這個時態(tài)中加載。
- env.onload = function(){
- return [ ];
- };
onrender
語法：env.onrender()當(dāng)數(shù)據(jù)獲取完成后，這些數(shù)據(jù)需要顯示在視圖(View)上，這個過程通過onrender()中的代碼來實(shí)現(xiàn)，這是Controller的第二個時態(tài)，負(fù)責(zé)完成對視圖(View)的渲染和指定轉(zhuǎn)場方式。
- env.onrender = function(doRender){
- doRender(viewName,transition);
- };
onready
語法：onready()這是Controller的第三個時態(tài)，在View渲染完成后，事件綁定、DOM操作等業(yè)務(wù)邏輯都在該時態(tài)中完成；每段邏輯使用session.event包裝，從而建立事件與視圖block的對應(yīng)關(guān)系。
- env.onready = function(){
- session.event(blockID,function(){
- });
- };
onsleep
語法：env.onsleep()當(dāng)Controller長時間不處于活動狀態(tài)時，可能會被置為睡眠狀態(tài)，以確保正在運(yùn)行中的Controller具有足夠的資源。如果需要在Controller被暫停之前運(yùn)行一些邏輯（比如暫存狀態(tài)等），可以在onsleep()中完成。
- env.onsleep = function(){
- };
onresume
語法：env.onresume()當(dāng)處在睡眠狀態(tài)的Controller被喚醒時，onresume()時態(tài)將被調(diào)用。該時態(tài)可用于執(zhí)行一些恢復(fù)性業(yè)務(wù)邏輯
- env.onresume = function(){
- };
ondestroy
語法：env.ondestroy當(dāng)Controller被銷毀時，ondestroy()將被調(diào)用。
- env.ondestroy = function(){
- };
onerror
語法： env.onerror當(dāng)前Controller收到錯誤消息時被觸發(fā)
- env.onerror = function(){
- };
subscribe
語法： 不帶參數(shù)： env.subscribe(publishName, function(collection){}); 帶參數(shù)： env.subscribe(publishName,arg1,arg2, ... , function(collection){});關(guān)于subscribe方法請查看“Publish/Subscribe”章節(jié)。
session
set
語法：session.set(key,value)在session中設(shè)置“key”的值
session.set('page',10);get
語法：session.get(key)獲取session中“key”的值
session.get('page');bind
語法：session.bind(block-id,dataMap)將數(shù)據(jù)綁定到視圖中block-id容器
- session.bind('student-list',{
- data : Collection.find()
- });
一般在subscribe(publishName,function(Collection){})的function(Collection){}中使用。
event
語法：seesion.event(block-id,function(){})建立事件與視圖block的對應(yīng)關(guān)系
- session.event('student-list'，function(){
- var submitButton = document.getElementById('submit');
- submitButton.addEventListener('click', submitMessage);
- });
eventMap
語法：session.eventMap(id,eventMap)對一個標(biāo)簽綁定多個事件
- session.eventMap('inputMessage',{
- 'focus':function(e){
- console.log('focus!');
- },
- 'blur':function(e){
- console.log('blur');
- },
- });
-
id
View中標(biāo)簽ID
-
eventMap
事件Map
commit
語法：session.commit()觸發(fā)數(shù)據(jù)對應(yīng)視圖block的更新
session.commit();
sub controller
創(chuàng)建的Controller可以作為另外一個Controller的子Controller使用。
callSubController
語法： callSubController(queryPath,options)在當(dāng)前Controller中調(diào)用一個子Controller，配合show()和hide()方法使用。
isready
語法：env.isready(){}當(dāng)前Controller的子Controller已經(jīng)加載完成
- env.isready = function(){
- };
show
語法：env.show(){}顯示當(dāng)前當(dāng)前Controller的子Controller
- env.show = function(){
- };
hide
語法：env.hide(){}隱藏當(dāng)前Controller的子Controller
- env.hide = function(){
- };
destory
語法：env.destory(){}銷毀當(dāng)前Controller的子Controller
- env.destroy = function(){
- };
本文名稱：CloudaAPI使用手冊之ViewTransitionController
轉(zhuǎn)載源于：http://www.5511xx.com/article/cdghheh.html
