自定义导航栏

## Tabber ### 1. 功能 开始分页导航功能 ### 2. 使用场景 页面需要使用到 Tabber 栏的时候 ![image.png](https://cos.easydoc.net/27100029/files/kbk4d8zo.png) ### 3. 如何使用 #### 3.1 HTML 页面添加代码 ```html <div class="layui-tab" lay-filter="tabSwitch"> <!-- 标题 --> <ul class="layui-tab-title"> <li class="layui-this">第一页</li> <!--初始选中--> <li>第二页</li> </ul> <div class="layui-tab-content"> <div class="layui-tab-item layui-show"></div> <!--初始选中--> <div class="layui-tab-item "></div> </div> </div> ``` #### 3.2 监听点击 Tabber 事件 ##### 3.2.1 JS 中引入 ```javascript var element = onion.element; ``` ##### 3.2.2 监听事件代码 ```javascript element.on('tab(tabSwitch)', function (data) { var index = data.index; if (index == 0) { // 点击分页一操作 } else { // 点击分页二操作 } }) ``` ### 4. api定义 ``` javascript onion.api = function(){ } ```