vant的dialog触发了其他overlay

原代码:

html 复制代码
<!-- dialog -->
	<van-dialog v-model="showTipsDialog" title="温馨提示">
	        <p>dialog内容</p>
	</van-dialog>

<!-- overlay -->
    <van-overlay style="display: flex" :show="showLoadingOverlay">
      <div><van-loading color="#1989fa" /></div>
    </van-overlay>

在触发showTipsDialog=true之后,dialog的遮罩层消失了,但是触发了overlay,并检查showLoadingOverlay是为false的。

排查原因:

因为调整overlay内容样式的时候直接把样式写在了overlay的style里面造成了样式污染,把样式写在自定义类名className即可解决。

html 复制代码
<van-overlay className="loading_overlay" :show="showLoadingOverlay">
      <div><van-loading color="#1989fa" /></div>
    </van-overlay>
相关推荐
ct9785 分钟前
TypeScript 中的泛型
前端·javascript·typescript
IT_陈寒8 分钟前
React hooks闭包陷阱把我坑惨了,原来这才是正确用法
前端·人工智能·后端
nnsix15 分钟前
MVC、MVP、MVVM 架构 笔记
java·开发语言·前端
qq_4203620316 分钟前
前端国际化方案
前端·javascript·vue.js·国际化·reactjs
向上的车轮17 分钟前
React 19 快速入门:拥抱服务端组件与新特性的现代化开发
前端·javascript·react.js
Smile_25422041821 分钟前
vue3 + ts reactive方式清空表单对象
开发语言·前端·javascript
多租户观察室22 分钟前
信通院标准体系2.0深度解读:低代码管理平台进入“精品竞争”时代
前端·低代码·程序员
云水一下25 分钟前
CSS3从零基础到精通(四):终章大项目——纯CSS构建企业品牌展示网站
前端·css3
147API33 分钟前
Claude Opus 4.8 接口与工程落地分析:长任务调用链应该怎么设计
java·前端·数据库
李子琪。42 分钟前
Web 漏洞与防御机制实验报告
前端·经验分享