head-img Force's Blog

uniapp微信小程序DOM元素v-show失效解决办法

JavaScript

uniapp微信小程序DOM元素v-show失效

问题代码

<div class="go-pc" v-show="goPcInfo.closable">
  <span>{{ goPcInfo.info }}</span>
</div>
<style lang="less" scoped>
#app {
  .editArea {
    .go-pc {
      display: flex;
      background: #e3f2ff;
      padding: 32rpx 36rpx;
      position: relative;
      ......

出现这个问题原因是因为.go-pc元素为flexv-show本质为noneblock,优先级比flex低,
所以解决这个问题只需要将v-show修改为v-if

<div class="go-pc" v-if="goPcInfo.closable">
  <span>{{ goPcInfo.info }}</span>
</div>
点我评论
打赏本文
二维码


128

文章

14

标签

 访客统计  Update-******