设置Tab按钮列表

setTabNav('tab列表', '当前tab')

先来个例子

  1. public function index($group = 'tab1')
  2. {
  3. $list_tab = [
  4. 'tab1' => ['title' => '标题1', 'url' => url('index', ['group' => 'tab1'])],
  5. 'tab2' => ['title' => '标题2', 'url' => url('index', ['group' => 'tab2'])],
  6. ];
  7. return ZBuilder::make('form')
  8. ->setTabNav($list_tab, $group)
  9. ->fetch();
  10. }

效果:

设置Tab按钮列表 - 图1

注意:此tab切换并非动态切换,而是跳转页面。

这样可以根据不同的接收到的group参数来分别显示不同的内容,比如:

  1. public function index($group = 'tab1')
  2. {
  3. $list_tab = [
  4. 'tab1' => ['title' => '标题1', 'url' => url('index', ['group' => 'tab1'])],
  5. 'tab2' => ['title' => '标题2', 'url' => url('index', ['group' => 'tab2'])],
  6. ];
  7. switch ($group) {
  8. case 'tab1':
  9. return ZBuilder::make('form')
  10. ->setTabNav($list_tab, $group)
  11. ->addText('name', '名称')
  12. ->fetch();
  13. break;
  14. case 'tab2':
  15. return ZBuilder::make('form')
  16. ->setTabNav($list_tab, $group)
  17. ->addTextarea('summary', '摘要')
  18. ->fetch();
  19. break;
  20. }
  21. }

两个页面如下:

tab1页面

设置Tab按钮列表 - 图2

tab2页面

设置Tab按钮列表 - 图3