a-tab-pane 二级页签联动

您可以使用 Bootstrap 提供的 JavaScript 组件来实现 a-tab-pane 二级页签的联动。具体的实现步骤如下：

1. 在 HTML 中定义一组二级页签，每个页签使用 a 标签和对应的 div 包含页签内容，其中 div 的 id 需要与 a 标签的 href 属性对应，如下所示：

<ul class="nav nav-tabs">
  <li class="nav-item">
    <a class="nav-link active" data-toggle="tab" href="#tab1">Tab 1</a>
  </li>
  <li class="nav-item">
    <a class="nav-link" data-toggle="tab" href="#tab2">Tab 2</a>
  </li>
</ul>
<div class="tab-content">
  <div class="tab-pane fade show active" id="tab1">Tab 1 Content</div>
  <div class="tab-pane fade" id="tab2">Tab 2 Content</div>
</div>

2. 使用 jQuery 监听一级页签的点击事件，并根据点击的页签 id 切换二级页签的显示状态，如下所示：

$('.nav-tabs a').click(function(){
  var tabId = $(this).attr('href');
  $('.tab-pane').removeClass('show active');
  $(tabId).addClass('show active');
});

以上代码会在点击一级页签时，首先获取对应的二级页签 id，然后移除所有二级页签的 show 和 active 类，最后给点击的二级页签添加 show 和 active 类，以实现联动效果。

希望这个解答能够帮助到您！