微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

微信小程序v-show被flex布局冲突失效

一个简单的tab切换,三个tab分别占满屏,v-show通过id控制。

因为poster项  flex布局了,tabId更改为2时,依然显示poster项。

几番对比,发现小程序v-show是通过伪类view[hidden]{display:none}实现,用户写的display: flex权重较高,使之失效。

<view class="main">
<view class="scroll word" v-if='tabId === 0'>  
</view>
<view class="scroll poster" v-if='tabId === 1'>
  <view class="posterItem"></view>
  <view class="posterItem"></view>
  <view class="posterItem"></view>
  <view class="posterItem"></view>
</view>
<view class="scroll video" v-if='tabId === 2'>222</view>
</view>

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 [email protected] 举报,一经查实,本站将立刻删除。

相关推荐