vue项目-点击添加或者修改按钮浏览器的屏幕变黑，再次点击屏幕之后浏览器恢复正常（火狐浏览器、ChromeCoreLauncher双核浏览器）

最新推荐文章于 2024-05-16 15:44:08 发布
最新推荐文章于 2024-05-16 15:44:08 发布
阅读量1.4k 收藏
点赞数
分类专栏： Vue 文章标签： 点击修改按钮浏览器的屏幕变黑 浏览器的屏幕变黑 再次点击屏幕之后浏览器恢复正
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_43290288/article/details/107627948
版权

今天在写springboot+vue项目的时候发现了一个bug，之前写的项目就没有这种情况，bug如下：

点击添加或者修改按钮浏览器的屏幕变黑，再次点击屏幕之后浏览器恢复正常

点击修改按钮
在这里插入图片描述

屏幕变黑
在这里插入图片描述再次点击屏幕，屏幕颜色恢复正常
在这里插入图片描述
之后，我就一点一点测试，点击F12看了后台管理器，发现但我点击修改按钮的时候，右侧黄色样式表发生了变化，然后我又查看了class类中的属性，看看到底是谁在作怪

在这里插入图片描述在这里插入图片描述

发现还是看不出什么
又想了想，是不是用display把它隐藏了就可了，所以我在全局样式表中加了一个display:none 的属性，问题解决了

在这里插入图片描述

梁同学与Android
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 1
    评论
专栏目录
vue3点击出现弹窗后背景变暗且不可操作
http____的博客
07-30 2206
vue3，点击后出现弹窗，弹窗后的背景变暗且不可滚动，不可点击
vue-print-nb 兼容低版本浏览器
11-28
标题提到的“vue-print-nb 兼容低版本浏览器”，这意味着该插件已经考虑到了对旧版浏览器的支持，确保在广泛的用户设备上能够正常工作。 在描述中，我们可以看到如何引入并使用 `vue-print-nb`。首先，通过 `import...
vue+element el-dialog弹出框会变暗解决办法
GGBond的博客
05-24 4116
问题如图 解决办法：加入append-to-body
vue项目-点击添加或者修改按钮浏览器的屏幕变黑，再次点击屏幕之后浏览器恢复正常（火狐浏览器、ChromeCoreLauncher双核浏览器）(1)
最新发布
2401_84620191的博客
05-16 347
本人分享一下这次字节跳动、美团、头条等大厂的面试真题涉及到的知识点，以及我个人的学习方法、学习路线等，当然也整理了一些学习文档资料出来是给大家的。知识点涉及比较全面，包括但不限于前端基础，HTML，CSS，JavaScript，Vue，ES6，HTTP，浏览器，算法等等开源分享：【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】前端视频资料：[外链图片转存中…(img-0RRnGUCY-1715845425420)]
echarts在VUE中使用时，IE打开导致样式缺失或颜色只显示黑色
tcmmx1993的博客
08-07 911
情况如题 根据自身情况，是由于使用了自适应导致echarts在渲染时丢失样式 两种解决办法： 1，渲染的目标容器限制固定大小 2，使用settimeout方法延迟加载echarts的渲染
vue页面点击无效，刷新了又可以点击
qq_42221321的博客
07-15 816
vue点击无效
vue element ui 打开弹窗出现黑框问题
xiaohua616的博客
04-20 597
完美解决 element ui 打开弹窗出现黑框问题
vue-browser-detect-plugin:Vue浏览器检测插件
05-14
Vue浏览器检测插件 Vue的简单插件，可检测浏览器名称，版本和用户代理。 安装 npm install vue-browser-detect-plugin 在您的main.js: import browserDetect from " vue-browser-detect-plugin " ; Vue.use...
Vue项目添加动态浏览器头部title的方法
10-18
主要介绍了Vue项目添加动态浏览器头部title的方法，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧
让webpack+vue-cil项目不再自动打开浏览器的方法
10-17
今天小编就为大家分享一篇让webpack+vue-cil项目不再自动打开浏览器的方法，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
vue监听浏览器原生返回按钮,进行路由转跳操作
10-14
主要介绍了vue监听浏览器原生返回按钮,进行路由转跳操作，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
chrome_launcher.exe
12-01
谷歌浏览器的启动器，原文件名：chrome_launcher.exe，下载后安装chrome，替换chrome_launcher.exe文件即可获得最新的chrome浏览器（反正chrome是免费滴，这莫有违反csdn资源上传协议）（积分，我来了）
ChromeCore_1256_1.0.4.2.exe
08-15
离线进行google代理扩展， Proxy SwitchyOmega代理插件使用简单，亲测有效
element抽屉点击时出现黑框的解决办法
laoyaoshilaoyao的博客
03-08 1294
/deep/ .el-drawer:focus { outline: none; }
Elment-ui有些组件选中后出现黑框
小锋QQmm~~的香蕉乐园
01-01 2770
Elment-ui有些组件选中后出现黑框，例如：el-drawer、el-calendar等。 解决方法就是在出现黑框的标签样式里覆盖以下样式： ::v-deep 样式名:focus { outline: none; }
elementUi按钮点击后仍有颜色 失焦后才会消失 想要点击后就失去颜色
菜同学的博客
02-23 2296
elementUi按钮点击后仍有颜色 失焦后才会消失 想要点击后就失去颜色。
vue全屏显示
yydszxd的博客
12-15 768
<el-button @click="screen=true">全屏显示</el-button> <div :class="screen?'screen':''"> <iframe :src="./static/tool/使用手册.pdf"></iframe> </div>
移动端开发H5页面点击按钮后出现闪烁或黑色背景的解决办法
在北风吹起的时候加入我们的队伍 在秋雨到来的时候成为彼此的温暖
11-03 4111
-webkit-tap-highlight-color:transparent; *{-webkit-tap-highlight-color:transparent;} H5页面在IOS端测试的时候发现，点击按钮会闪动，出现一个黑色的背景一闪而过，影响用户体验。最后找到解决方法： 就是给点击的元素添加一个CSS属性或者全局添加一个css。 ios和android下触摸元素时出现半透明灰色遮罩.........
vue-admin-template工程，点击浏览器刷新按钮时刷新很慢
05-31
这个问题可能与webpack-dev-server的配置有关。可以尝试增加以下配置项来提高刷新速度： 1. 在webpack.dev.conf.js中增加以下内容： ```javascript devServer: { clientLogLevel: 'warning', hot: true, contentBase: false, // since we use CopyWebpackPlugin. compress: true, host: 'localhost', port: 8080, open: false, overlay: { warnings: false, errors: true }, publicPath: '/', quiet: true, watchOptions: { poll: true, }, }, ``` 2. 在package.json中增加以下内容： ```json "config": { "webpackDevServer": { "disableHostCheck": true } }, ``` 以上两个配置项可以让webpack-dev-server在进行热更新时更加快速，同时解决一些可能出现的网络问题导致的刷新缓慢问题。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

梁同学与Android

你的鼓励将是我创作的最大动力！

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值