bui.page Class
Constructor
bui.page
-
option
Parameters:
-
optionObject-
urlString[页面id]
-
[dialogid]String optional1.6.2新增 指定生成的dialog id, 便于 bui.history.getPageDialog(id);
-
[param]Object optional传给 url的参数, url里面的模块需要使用 bui.history.getParams(module.id) 获取
-
[script]String optional可以指定模块的脚本, 默认不需要写, 按模块的同名规范加载.
-
[appendTo]String optional打开的页面要加载到哪个容器下, 默认是".bui-page", 如果是 body, bui-router 等非单页里面的选择器, 则模块里面,不能使用 router.$, 应该使用 $, 包括里面用到的控件id, 之前是字符串, 现在是对象 $("#xxx"), 控件才能正常.
-
[autoload]Boolean optional默认 true 自动执行 | false
-
[syncHistory]Boolean optional是否同步历史记录, 默认 false | true; 同步历史记录用户使用后退可以回到创建的页面
-
[cache]Boolean optional默认 true (只加载一次) | false (每次调用打开都执行一次)
-
[iframe]Boolean optional默认 false | true 打开外部地址,或者多页
-
[useBox]Boolean optional默认 false 使用计算main高度 ｜ true 使用弹性布局（如果加载的是弹性布局的页面，会导致手机端高度100%不准确）
-
[resize]Boolean optional1.8.0 默认 true 每次reload都重新计算高度
-
[effect]String optional默认 "pushInRight" 打开的动画, 具体查看 bui.toggle 的api
-
[fullscreen]Boolean optional默认 true | false 默认全屏
-
[mask]Boolean optional是否需要遮罩，默认 false | true
-
[width]String optional默认 0 ,自适应 fullscreen false 才会有效
-
[height]String optional默认 0 ,自适应 fullscreen false 才会有效
-
[style]Object optional默认 {top:0,right:0,bottom:0,right:0} 用来控制全屏的 上下左右位置
-
[close]Boolean optional默认 false | true 需要右上角有关闭按钮
-
[needRemove]Boolean optional默认 false | true 点击右上角关闭按钮,是否移除对话框,默认不需要
-
[openFirst]Boolean optional默认 true 先打开动画以后再执行模块 | false 先执行模块再打开动画
-
[closeFirst]Boolean optional默认 false 如果模块有hide,执行模块的hide 跟关闭一起执行. | true 先执行关闭动画, 如果模块有hide,再执行模块的hide
-
[beforeOpen]Function optional打开前执行, return false 则不执行打开操作
-
[opened]Function optional每次打开后执行
-
[beforeClose]Function optional关闭前执行, return false 则不执行关闭操作
-
[closed]Function optional每次关闭后执行
-
[beforeLoad]Function optional加载前执行,只执行一次
-
[onError]Function optional找不到页面执行
-
[loaded]Function optional初始化后执行,只执行一次
-
Example:
方法1:
var uiPage = bui.page({
url:"pages/login/login.html",
param: {}
})
方法2:
var uiPage = bui.page({
url:"pages/login/login.html",
autoload: false
})
$("#id").click(function(){
uiPage.open();
})
注意: bui.page 加载的页面,不会自动计算main 的高度, 建议里面的页面采用新的 page 结构,会自动适配.
<div class="bui-page bui-vertical-box">
<header>
<div class="bui-bar">
<div class="bui-bar-left"></div>
<div class="bui-bar-main">标题栏</div>
<div class="bui-bar-right"></div>
</div>
</header>
<main>
主要内容会自动减去 footer header 的高度.
</main>
<footer></footer>
</div>
Methods
close
-
[callback]
关闭
Parameters:
-
[callback]Function optional关闭后执行
Example:
// 关闭
uiPage.close();
compile
()
chainable
重新编译执行, 默认打开第一次已经编译过了, 无需继续编译
Example:
// 切换
uiPage.compile();
hide
-
[callback]
无动画关闭对话框
Parameters:
-
[callback]Function optional回调
Example:
uiPage.hide();
isOpen
()
Boolean
chainable
打开的状态
Returns:
Example:
// 切换
var status = uiPage.isOpen();
open
-
[callback]
打开
Parameters:
-
[callback]Function optional打开后执行
Example:
// 打开
uiPage.open();
reload
-
[option]
重新加载
Parameters:
-
[option]Object optional跟 初始化一样的参数, 也可以单独传参数就好
Example:
// 重新加载
uiPage.reload();
// 重新加载并传参
uiPage.reload({
param: {
keyword: "new word"
}
});
remove
-
[callback]
移除对话框
Parameters:
-
[callback]Function optional关闭后执行
Example:
// 关闭
uiPage.remove();
replace
-
[option]
替换页面
Parameters:
-
[option]Object optional跟 初始化一样的参数, 也可以单独传参数就好
Example:
// 重新加载并传参
uiPage.replace({
url: "",
param: {
keyword: "new word"
}
});
show
-
[callback]
无动画打开对话框
Parameters:
-
[callback]Function optional回调
Example:
uiPage.show();
toggle
-
[onOpen] -
[onClose]
切换展示, 打开就关闭,关闭就打开
Parameters:
-
[onOpen]Function optional打开后执行
-
[onClose]Function optional关闭后执行
Example:
// 切换
uiPage.toggle();
// 切换加回调
uiPage.toggle(function(){
// 打开执行
},function(){
// 关闭执行
});