genealogy-min-program/custom-tab-bar/index.wxml

<view class="tab-bar">
  <view class="tab-bar-inner">
    <view
      class="tab-item {{selected === index ? 'tab-item-active' : ''}}"
      wx:for="{{tabs}}"
      wx:key="pagePath"
      data-index="{{index}}"
      bindtap="switchTab"
    >
      <!-- 激活时顶部指示条 -->
      <view class="tab-indicator {{selected === index ? 'indicator-show' : ''}}"></view>

      <!-- 图标容器 -->
      <view class="tab-icon-wrap {{selected === index ? 'icon-wrap-active' : ''}}">
        <svg-icon wx:if="{{false}}"></svg-icon>
        <view class="tab-svg-box">
          <view class="tab-icon-bg {{selected === index ? 'icon-bg-active' : ''}}"></view>
          <!-- SVG path via background -->
          <view class="tab-icon-img icon-{{index}} {{selected === index ? 'icon-img-active' : ''}}"></view>
        </view>
      </view>

      <!-- 标签文字 -->
      <text class="tab-label {{selected === index ? 'tab-label-active' : ''}}">{{item.name}}</text>
    </view>
  </view>
</view>