NervJS/taro

在 vue3 nutui 页面中使用了 Layout 布局 会导致微信小程序的 custom-tab-bar 样式失效

Closed this issue · 1 comments

puzzle9 commented

相关平台

微信小程序

复现仓库

git@github.com:puzzle9/NervJS-taro-issues-15754.git

小程序基础库: 2.25.3
使用框架: Vue 3

复现步骤

custom-tab-bar/index.vue

      <nut-row>
        <nut-col :span="24">
          <view class="content" style="background: #7d7e80">span:24</view>
        </nut-col>
        <nut-col :span="12">
          <view class="content" style="background: #fffbe8">span:12</view>
        </nut-col>
        <nut-col :span="6">
          <view class="content" style="background: #323233">span:6</view>
        </nut-col>
      </nut-row>

pages/index/index.vue

      <nut-row>
        <nut-col :span="24">
          <view class="content" style="background: red">span:24</view>
        </nut-col>
      </nut-row>

期望结果

小程序的 custom-tab-bar 组件样式正常

实际结果

微信小程序的 custom-tab-bar 无 css 样式
image

环境信息

👽 Taro v3.6.29


  Taro CLI 3.6.29 environment info:
    System:
      OS: Linux 6.6 Arch Linux
      Shell: 5.9 - /bin/zsh
    Binaries:
      Node: 22.0.0 - /usr/bin/node
    npmPackages:
      @tarojs/cli: 3.6.29 => 3.6.29 
      @tarojs/components: 3.6.29 => 3.6.29 
      @tarojs/helper: 3.6.29 => 3.6.29 
      @tarojs/plugin-framework-vue3: 3.6.29 => 3.6.29 
      @tarojs/plugin-html: 3.6.29 => 3.6.29 
      @tarojs/plugin-platform-alipay: 3.6.29 => 3.6.29 
      @tarojs/plugin-platform-h5: 3.6.29 => 3.6.29 
      @tarojs/plugin-platform-jd: 3.6.29 => 3.6.29 
      @tarojs/plugin-platform-qq: 3.6.29 => 3.6.29 
      @tarojs/plugin-platform-swan: 3.6.29 => 3.6.29 
      @tarojs/plugin-platform-tt: 3.6.29 => 3.6.29 
      @tarojs/plugin-platform-weapp: 3.6.29 => 3.6.29 
      @tarojs/runtime: 3.6.29 => 3.6.29 
      @tarojs/shared: 3.6.29 => 3.6.29 
      @tarojs/taro: 3.6.29 => 3.6.29 
      @tarojs/taro-loader: 3.6.29 => 3.6.29 
      @tarojs/webpack5-runner: 3.6.29 => 3.6.29 
      babel-preset-taro: 3.6.29 => 3.6.29
eiinu commented

#11060
自定义 Tabbar 需要设置参数开启全局样式

  • 👍1
  • 🎉1
  • ❤️1