GV000
GV000
  • 发布:2023-12-05 17:29
  • 更新:2023-12-05 17:37
  • 阅读:214

swiper嵌套scroll-view设置 margin-bottom/padding-bottom出现 page.json 导航栏元素增高空白

分类:uni-app x
<template>  
        <swiper  
            class="container_swiper"  
            :indicator-dots="false"  
            :autoplay="false"  
            :interval="3000"  
            :duration="1000"  
        >  
          <swiper-item class="container_swiper_item">  
            <scroll-view class="container_swiper_item_content" :scroll-x="false" :scroll-y="true" :show-scrollbar="false">  
              <view style="height:100;">1</view>  
              <view style="height:100;">1</view>  
              <view style="height:100;">1</view>  
              <view style="height:100;">1</view>  
              <view style="height:100;">1</view>  
              <view style="height:100;">1</view>  
              <view style="height:100;">1</view>  
              <view style="height:100;">1</view>  
              <view style="height:100;">1</view>  
              <view style="height:100;">1</view>  
              <view style="height:100;">1</view>  
              <view style="height:100;">1</view>  
            </scroll-view>  
          </swiper-item>  
          <swiper-item class="container_swiper_item">  
            <scroll-view class="container_swiper_item_content" :scroll-x="false" :scroll-y="true" :show-scrollbar="false">  
              <view style="height:100;">2</view>  
              <view style="height:100;">2</view>  
              <view style="height:100;">2</view>  
              <view style="height:100;">2</view>  
              <view style="height:100;">2</view>  
              <view style="height:100;">2</view>  
              <view style="height:100;">2</view>  
              <view style="height:100;">2</view>  
              <view style="height:100;">2</view>  
              <view style="height:100;">2</view>  
              <view style="height:100;">2</view>  
              <view style="height:100;">2</view>  
            </scroll-view>  
          </swiper-item>  
        </swiper>  
</template>
<style lang="scss" scoped>  
.container_swiper{  
  padding-bottom: 150;  
}  
</style>
<style lang="scss" scoped>  
.container_swiper_item{  
  padding-bottom: 150;  
}  
</style>
<style lang="scss" scoped>  
.container_swiper_item_content{  
  padding-bottom: 150;  
}  
</style>

设置上面任何一个 style 里的 class 都会出现 page.json里的 tabbar出现增高情况, padding-bottom越大tabbar 高度越高
是不是bug?影响到了 tabbar 的样式?

2023-12-05 17:29 负责人:无 分享
已邀请:
GV000

GV000 (作者) - 全栈开发工程师

因为底部导航栏会遮挡元素,所以用这个 css出现了tabbar 增高

GV000

GV000 (作者) - 全栈开发工程师

试了一下,在最外层添加一个 view 设置 这个 css 也会出现tabbar 增高

要回复问题请先登录注册