vux [Bug Report] loading和x-dialog组件一起使用时,loading有短暂时间显示在diolog后面

snvhrwxg  于 2023-03-19  发布在  其他
关注(0)|答案(4)|浏览(225)

VUX version

2.9.4

OS/Browsers version

Chrome 75.0.3770.100

Vue version

2.6.10

Code

<div v-transfer-dom>
      <x-dialog v-model="showDialog" class="dialog-demo">
         <div style="padding:15px;">
          <x-button @click.native="doShowLoading" type="primary">show loading</x-button>
        </div>
      </x-dialog>
  </div>

 <div v-transfer-dom>
      <loading :show="showLoading" text="123"></loading>
 </div>

Steps to reproduce

1.弹出x-dialog
2.点击x-dialog内的按钮弹出loading

What is Expected?

loading 组件显示在最前面

What is actually happening?

loading 组件显示在x-dialog后面

e0bqpujr

e0bqpujr2#

无法复现,请提供完整的代码

ggazkfy8

ggazkfy83#

我直接在demo上改的,把文件覆盖到 src\demos目录就可以了

我这边目前查出来的问题是因为loading组件里的动画造成的

.vux-mask-leave-active, .vux-mask-enter-active {
  transition: opacity 300ms;
}

我目前的解决方案是在使用loading组件时指定个不存在的transition,相当于禁用了动画效果,不知道有没有更好的方案

<loading v-model="isLoading" :text="loadingText" transition="none"></loading>

附件:
XDialog.zip

brccelvz

brccelvz4#

是动画引起的,不过很快就浮现到最前面了。如果介意,就禁用了吧。

相关问题