企业🤖AI智能体构建引擎,智能编排和调试,一键部署,支持私有化部署方案 广告
## setTabCon('tab名', 'tab内容') ~~~ $tab_list = [ 'tabs-1' => '<i class="fa fa-fw fa-coffee"></i> Tab1', 'tabs-2' => '<i class="fa fa-fw fa-line-chart"></i> Tab2' ]; $recent_list = [ [ 'title' => '最近编辑文件', 'link' => [ 'title' => '<i class="fa fa-file-text-o"></i> Documentation.doc', 'url' => url('index') ], 'tips' => '15 分钟前', 'icon' => 'si si-pencil text-info' ], [ 'title' => '最近删除文件', 'link' => [ 'title' => '<i class="fa fa-file-text-o"></i> Documentation2.doc', 'url' => url('index') ], 'tips' => '4 小时前', 'icon' => 'si si-close text-danger' ] ]; $settings = [ [ 'title' => '站点开关', 'tips' => '站点关闭后将不能访问', 'checked' => Db::name('admin_config')->where('id', 1)->value('value'), 'table' => 'admin_config', 'id' => 1, 'field' => 'value' ] ]; ZBuilder::make('aside') ->setTabNav($tab_list, 'tabs-1') ->setTabCon('tabs-1', [ ['recent', '最近事项', $recent_list] ]) ->setTabCon('tabs-2', [ ['switch', '系统设置', $settings] ]); ~~~ 这样就可以切换不同的tab,显示不同的内容。 ![](https://box.kancloud.cn/cb1ecb9ba9d976e99069ae790c7a8465_328x349.png) ![](https://box.kancloud.cn/5e35e63777eb7c56c1cb31a1345c0a6c_332x316.png) 一个tab内容可设置多项内容 ~~~ ZBuilder::make('aside') ->setTabNav($tab_list, 'tabs-1') ->setTabCon('tabs-1', [ ['recent', '最近事项', $recent_list], ['switch', '系统设置', $settings] ]); ~~~