feat: 项目基础框架+配置+Kernel
This commit is contained in:
@@ -0,0 +1,149 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<meta http-equiv="X-UA-Compatible" content="ie=edge">
|
||||
<title>Navbar组件</title>
|
||||
<link rel="stylesheet" href="./plugins/layui/css/layui.css" media="all">
|
||||
<link rel="stylesheet" href="./build/css/doc.css" media="all">
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div class="kit-doc">
|
||||
<blockquote class="layui-elem-quote">Tab组件是基于<a href="http://www.layui.com/doc/element/tab.html" target="_blank">layui选项卡</a> 封装的组件,配合
|
||||
<a href="navbar.html">Navbar组件</a>能完成多开页面的操作</blockquote>
|
||||
<div class="kit-doc-title">
|
||||
<fieldset>
|
||||
<legend><a name="blockquote">可用的方法</a></legend>
|
||||
</fieldset>
|
||||
</div>
|
||||
<table class="layui-table">
|
||||
<colgroup>
|
||||
<col width="150">
|
||||
<col width="200">
|
||||
<col width="150">
|
||||
<col>
|
||||
</colgroup>
|
||||
<thead>
|
||||
<tr>
|
||||
<th>名称</th>
|
||||
<th>参数</th>
|
||||
<th>返回值</th>
|
||||
<th>描述</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>set(options)</td>
|
||||
<td><a href="#options">options</a>/object</td>
|
||||
<td>this/object</td>
|
||||
<td>配置一些全局参数,返回当前tab对象,以便于链式调用
|
||||
<p>Example:</p>
|
||||
<pre class="layui-code">
|
||||
tab.set({
|
||||
elem:'#container'
|
||||
});</pre>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>render()</td>
|
||||
<td>null</td>
|
||||
<td>void</td>
|
||||
<td>渲染tab选项卡到页面</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>tabAdd(params)</td>
|
||||
<td>params/object</td>
|
||||
<td>void</td>
|
||||
<td>添加一个选项卡
|
||||
<p>Example:</p>
|
||||
<pre class="layui-code">
|
||||
tab.tabAdd({
|
||||
icon:'fa-user',
|
||||
id:'11',
|
||||
title:'新选项卡',
|
||||
url:'newtab.html'
|
||||
});</pre> 与navbar配合着用
|
||||
<p>Example:</p>
|
||||
<pre class="layui-code">
|
||||
navbar.bind(function(data) {//bind方法为navbar组件提供的方法
|
||||
tab.tabAdd(data);
|
||||
});</pre>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
<div class="kit-doc-title">
|
||||
<fieldset>
|
||||
<legend><a name="blockquote" id="options">options参数说明</a></legend>
|
||||
</fieldset>
|
||||
</div>
|
||||
<table class="layui-table">
|
||||
<colgroup>
|
||||
<col width="150">
|
||||
<col width="150">
|
||||
<col width="150">
|
||||
<col>
|
||||
</colgroup>
|
||||
<thead>
|
||||
<tr>
|
||||
<th>名称</th>
|
||||
<th>类型</th>
|
||||
<td>默认值</td>
|
||||
<th>描述</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>elem</td>
|
||||
<td>string</td>
|
||||
<td>#container</td>
|
||||
<td>容器DOM,支持id选择器和类选择器</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>mainUrl</td>
|
||||
<td>string</td>
|
||||
<td>main.html</td>
|
||||
<td>控制面板的链接</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>onSwitch</td>
|
||||
<td>function</td>
|
||||
<td>undefined</td>
|
||||
<td>选择卡切换时将触发该事件<br/> 示例:
|
||||
<pre class="layui-code">
|
||||
tab.set({
|
||||
onSwitch: function(data) { //选项卡切换时触发
|
||||
//console.log(data.layId); //lay-id值
|
||||
//console.log(data.index); //得到当前Tab的所在下标
|
||||
//console.log(data.elem); //得到当前的Tab大容器
|
||||
}}); </pre>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>closeBefore</td>
|
||||
<td>function</td>
|
||||
<td>undefined</td>
|
||||
<td>关闭选项卡之前触发该事件<br/> 示例:
|
||||
<pre class="layui-code">
|
||||
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则关闭
|
||||
}}); </pre>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
<blockquote class="layui-elem-quote">这个文档就先写到这里吧,后面新增了再补充啦。</blockquote>
|
||||
</div>
|
||||
<script src="./plugins/layui/layui.js"></script>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
Reference in New Issue
Block a user