1.原因

  页面中存在多个Modal同时渲染及弹出(在table里使用Modal就会出现这种问题)

2.解决方案

  不让多个Modal同时渲染就行了,设置Modal的visible属性为this.state.delModalVisible,this.state.delModalVisible的值为[], 如果是在table里可以这么做:

showDelModal(id) {
const delModalVisible = this.state.delModalVisible
delModalVisible[id] = true
this.setState({
delModalVisible
})
}
{ this.state.delModalVisible[record.id] ?
<Modal
visible={this.state.delModalVisible[record.id]}
>
</Modal>
: null
}

这样就达到想让哪个弹窗出来就让哪个弹窗出来的效果了,颜色也不会加深,效率也提高了

ant design Modal遮罩层颜色加深 解决方案的更多相关文章

  1. modal 遮罩层,滚动穿透 bug

    modal 遮罩层,滚动 穿透bug float 弹层 taro 小程序弹框 滚动击穿 问题 https://segmentfault.com/q/1010000011134345 solution ...

  2. ant design Modal关闭时清除数据的解决方案

    背景:modal组件关闭时不清除数据,原来输入的数据还存在 解决方案: 1.modal的api:destroyOnClose 2.手动控制modal的销毁 this.state = { destroy ...

  3. 解决 Ant Design Modal 中的 Select 选项框不能显示的问题

    antd 的 select 在 modal 里不能显示候选框 代码示例 <a-modal> <a-select> <!-- options --> </a-s ...

  4. js中奇怪的问题 同步ajax,modal遮罩层

    奇怪问题一 今天有一段js执行的时候出现了问题 $.ajax({ ..., async:false, ... }); $('#myModal').modal('hide'); loadcurrentp ...

  5. iOS 自定义相机带拍摄区域边框及半透明遮罩层(含源码)

    开始时准备封装成ViewController的相机,但是在不改我相机控件源码的情况下,使用者很难自定义UI.于是想到将相机核心功能封装到View里,暴露出功能方法给外面调用,调用者只需将LFCamer ...

  6. modal 弹框遮罩层,滚动穿透bug 解决方案

    modal 弹框遮罩层,滚动穿透bug 解决方案 parent component 动态设置 lock css const computedClassName = classNames( 'activ ...

  7. layer弹出层不居中解决方案,仅显示遮罩,没有弹窗

    问题:项目中layer询问层的弹窗仅显示遮罩层,并不显示弹窗…… 原因:图片太多将layer弹窗挤出屏幕下方,看不见了…… 解决方案:让layer的弹出层居中显示 一.问题描述 用layer做操作结果 ...

  8. Ant Design项目记录和CSS3的总结和Es6的基本总结

    这里主要是介绍自己运用ANT框架的一些小总结,以前写到word里,现在要慢慢传上来, 辅助生殖项目总结:从每个组件的运用的方法和问题来总结项目. 1.项目介绍 辅助生殖项目主要运用的是Ant.desi ...

  9. easyui中使用的遮罩层

    easyui 的 dialog 是继承自 window的,而 window中有modal这样的属性(见参考资料),就是用于打开模态的窗口的,也就是你说的有遮罩层的窗口.所以不需要额外的代码,仅需在di ...

随机推荐

  1. yum怎么用?

    一.yum 简介 yum,是Yellow dog Updater, Modified 的简称,是杜克大学为了提高RPM 软件包安装性而开发的一种软件包管理器.起初是由yellow dog 这一发行版的 ...

  2. Gradle详解

    一.脚本文件(build.gradle)  项目与脚本文件 当我们执行gradle命令的时候,Gradle会在你执行命令的目录下寻找一个名为build.gradle的文件,这个文件就是Gradle的脚 ...

  3. Java代码优化总结

    代码优化是一个很重要的课题.一般来说,代码优化的目标主要有两个,一个是减小代码的体积,另一个是提高代码运行的效率. 代码优化的细节有很多,此处列举部分: 1.尽量指定类.方法的final修饰符. 带有 ...

  4. HTML5 localStorage、sessionStorage 作用域

    一.localStorage localStorage有效期:永不失效,除非web应用主动删除. localStorage作用域:localStorage的作用域是限定在文档源级别的.文档源通过协议. ...

  5. python基础--re模块

    常用正则表达式符号 '.' 默认匹配除\n之外的任意一个字符,若指定flag DOTALL,则匹配任意字符,包括换行 '^' 匹配字符开头,若指定flags MULTILINE,这种也可以匹配上(r& ...

  6. Kaggle案例分析1--Bestbuy

    1. 引言 Kaggle是一个进行数据挖掘和数据分析在线竞赛网站, 成立于2010年. 与Kaggle合作的公司可以提供一个数据+一个问题, 再加上适当的奖励, Kaggle上的计算机科学家和数据科学 ...

  7. Ibatis.Net 各种配置说明学习(二)

    1.各个配置文件的配置说明 providers.config:指定数据库提供者,.Net版本等信息. xxxxx.xml:映射规则. SqlMap.config:大部分配置一般都在这里,如数据库连接等 ...

  8. 16/11/22_plsql

    1.数据类型: char 固定长度,varchar 字符长度按照实际长度, varchar2 字符均存储2个字节, nvarchar 按照Unicode存储.number(m,n)总长度m,小数 n. ...

  9. group by 并且 count(1)的linq写法

    SELECT [MobleNo],count(1) FROM [CustMobleNo] group by [MobleNo] GO ===作用等于=== var rst = from c in da ...

  10. supervisor管理uwsgi

    1. 前言 传统的管理uwsgi服务: 1. 通过shell脚本来编写start restart stop函数来控制 2. 比较麻烦,有时候控制写的烂,还会出现意想不到的错误 supervisor进行 ...