View
View使用handlebars组件作为模板引擎，handlebars语法请参考官网。
为了更快的开发视图代码，Clouda对handlebars的语法做了一些扩展：
-
view中引入view
语法： {{> viewName}}在一个View中引用另一个View。
-
view中使用JS
语法： {{$ alert("data.length"); }}在View中直接执行Javascript代码，并将返回结果输出在View中。
-
foreach
用于快速遍历一个对象或数组
语法：{{#foreach}}{{/foreach}}用法示例：
- <p id="test-foreach-caseB">
- {{#foreach customObj}}
- {{key}} : {{value}}
- {{/foreach}}
- </p>
-
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}}
注意：当省略operator时，系统默认使用操作符 ==：
{{#compare 1 1}} 1 == 1 {{/compare}} -
sumeru.config.view.set
语法：sumeru.config.view.set('path', viewpath);一般情况下将编写的view文件存放在app/view文件夹下，如果编写的view文件不在View文件夹下，我们也提供View文件路径配置的方法，框架会在配置路径下寻找需要的View文件:
实例：
sumeru.config.view.set('path', 'path/to/');则Clouda会在如下目录中加载视图：
app目录/path/to/view/注意:即使是修改viewpath的情况下，在最内一侧仍然需要有一层view文件夹，如上面路径的最后部分。
#p#
Transition
当场景发生转换时，通过transition定义场景转换效果。
doRender(viewName,transition)-
viewName
需要渲染View的名称
-
transition
-
push
推出
-
方向
-
left
从左向右推出
-
right
从右向左推出
-
up
从上向下推出
-
down
从下向上推出
-
-
-
rotate
旋转
-
方向
-
left
-
right
-
-
-
fade
渐变
-
方向
-
z-index
垂直方向
-
-
-
shake
退出场景时先缩小后放大退出，进入场景从左或者右边推入
-
方向
-
left
从左推入进场
-
right
从右推入进场
-
-
-
none
没有转场效果
-
方向参数
-
z
默认参数
-
-
实例：
- env.onrender = function(doRender){
- doRender('student', ['push', 'down']);
- };
- env.onrender = function(doRender){
- doRender('student', ['none', 'z']);
- };
-
#p#
Controller
如果你曾经接触过MVC模型，那么将会很熟悉Controller的概念。在Clouda中，Controller是每个场景的控制器，负责实现App的核心业务逻辑。
-
create
语法：sumeru.controller.create(function(env,session){});创建一个Controller
App.studentList = sumeru.controller.create(function(env,session){}); -
env
-
redirect
语法：env.redirect(queryPath,paramMap,isforce)一个Controller跳转到另一个Controller
env.redirect('/studentList',{'class':'101'});-
queryPath
router中pattern的值
-
paramMap
需要向跳转Controller传递的参数 -
isforce
是否强制生成一个全新的Controller实例。
如果在redirect中使用paramMap，可以在跳转目标Controller的create()中"param"接受参数。
- App.studentList = sumeru.controller.create(function(evn,session,param){
- });
-
-
refresh
语法： env.refresh()重新加载当前Controller
env.refresh(); -
onload
语法：env.load()onload()是Controller的第一个时态，Controller中需要使用的数据都在这个时态中加载。
- env.onload = function(){
- return [ ];
- };
-
onrender
语法：env.onrender()当数据获取完成后，这些数据需要显示在视图(View)上，这个过程通过onrender()中的代码来实现，这是Controller的第二个时态，负责完成对视图(View)的渲染和指定转场方式。
- env.onrender = function(doRender){
- doRender(viewName,transition);
- };
-
onready
语法：onready()这是Controller的第三个时态，在View渲染完成后，事件绑定、DOM操作等业务逻辑都在该时态中完成；每段逻辑使用session.event包装，从而建立事件与视图block的对应关系。
- env.onready = function(){
- session.event(blockID,function(){
- });
- };
-
onsleep
语法：env.onsleep()当Controller长时间不处于活动状态时，可能会被置为睡眠状态，以确保正在运行中的Controller具有足够的资源。如果需要在Controller被暂停之前运行一些逻辑（比如暂存状态等），可以在onsleep()中完成。
- env.onsleep = function(){
- };
-
onresume
语法：env.onresume()当处在睡眠状态的Controller被唤醒时，onresume()时态将被调用。该时态可用于执行一些恢复性业务逻辑
- env.onresume = function(){
- };
-
ondestroy
语法：env.ondestroy当Controller被销毁时，ondestroy()将被调用。
- env.ondestroy = function(){
- };
-
onerror
语法： env.onerror当前Controller收到错误消息时被触发
- env.onerror = function(){
- };
-
-
subscribe
语法： 不带参数： env.subscribe(publishName, function(collection){}); 带参数： env.subscribe(publishName,arg1,arg2, ... , function(collection){});关于subscribe方法请查看“Publish/Subscribe”章节。
-
session
-
set
语法：session.set(key,value)在session中设置“key”的值
session.set('page',10); -
get
语法：session.get(key)获取session中“key”的值
session.get('page'); -
bind
语法：session.bind(block-id,dataMap)将数据绑定到视图中block-id容器
- session.bind('student-list',{
- data : Collection.find()
- });
一般在subscribe(publishName,function(Collection){})的function(Collection){}中使用。
-
event
语法：seesion.event(block-id,function(){})建立事件与视图block的对应关系
- session.event('student-list'，function(){
- var submitButton = document.getElementById('submit');
- submitButton.addEventListener('click', submitMessage);
- });
-
eventMap
语法：session.eventMap(id,eventMap)对一个标签绑定多个事件
- session.eventMap('inputMessage',{
- 'focus':function(e){
- console.log('focus!');
- },
- 'blur':function(e){
- console.log('blur');
- },
- });
-
id
View中标签ID
-
eventMap
事件Map
-
commit
语法：session.commit()触发数据对应视图block的更新
session.commit();
-
sub controller
创建的Controller可以作为另外一个Controller的子Controller使用。
-
callSubController
语法： callSubController(queryPath,options)在当前Controller中调用一个子Controller，配合show()和hide()方法使用。
-
isready
语法：env.isready(){}当前Controller的子Controller已经加载完成
- env.isready = function(){
- };
-
show
语法：env.show(){}显示当前当前Controller的子Controller
- env.show = function(){
- };
-
hide
语法：env.hide(){}隐藏当前Controller的子Controller
- env.hide = function(){
- };
-
destory
语法：env.destory(){}销毁当前Controller的子Controller
- env.destroy = function(){
- };
-
