Tab组件是基于layui选项卡 封装的组件,配合 Navbar组件能完成多开页面的操作
| 名称 | 参数 | 返回值 | 描述 |
|---|---|---|---|
| set(options) | options/object | this/object | 配置一些全局参数,返回当前tab对象,以便于链式调用
Example:
tab.set({
elem:'#container'
});
|
| render() | null | void | 渲染tab选项卡到页面 |
| tabAdd(params) | params/object | void | 添加一个选项卡
Example:
tab.tabAdd({
icon:'fa-user',
id:'11',
title:'新选项卡',
url:'newtab.html'
}); 与navbar配合着用
Example:
navbar.bind(function(data) {//bind方法为navbar组件提供的方法
tab.tabAdd(data);
});
|
| 名称 | 类型 | 默认值 | 描述 |
|---|---|---|---|
| elem | string | #container | 容器DOM,支持id选择器和类选择器 |
| mainUrl | string | main.html | 控制面板的链接 |
| onSwitch | function | undefined | 选择卡切换时将触发该事件 示例:
tab.set({
onSwitch: function(data) { //选项卡切换时触发
//console.log(data.layId); //lay-id值
//console.log(data.index); //得到当前Tab的所在下标
//console.log(data.elem); //得到当前的Tab大容器
}});
|
| closeBefore | function | undefined | 关闭选项卡之前触发该事件 示例:
tab.set({
closeBefore: function(data) { //关闭选项卡之前触发
// console.log(data);
// console.log(data.icon); //显示的图标
// console.log(data.id); //lay-id
// console.log(data.title); //显示的标题
// console.log(data.url); //跳转的地址
return true; //返回true则关闭
}});
|
这个文档就先写到这里吧,后面新增了再补充啦。