写这篇文章的原因是因为在项目中用到了Antd Design的React组件，当有业务需求需要用到模态框的时候遇到了一些小问题，Antd的模态框Modal组件时不能拖拽的，一般情况下不可拖拽也没什么大的问题，但是遇到了客户提的需求，因此就想着在Modal组件原有的基础上进行扩展，封装一个可拖拽 ...

用两个button（添加，编辑）按钮展示同一个模态框，并不是什么大问题，问题在于解决这两个模态框得有自己的确定和取消方法 父页面完全接管子页面（利于子页面复用） 父页面代码： 子页面代码： 使用上面这种方式，子页面基本上不需要处理什么业务逻辑，所有方法都由父页面 ...

背景： 　　由于项目中需要使用到 ant-design 的模态框组件，但是默认的右上角取消按钮不能自定义事件，但是客户又需要显示出来,并且点击的时候提示是否需要删除，不能隐藏，那么就只有想办法取消默认事件，改为自定义的。 ...

效果如下: 代码: 直接在modal里写,这里用了插槽~ ...

代码示例 问题 当点击 <select> 的时候，发现下拉选项没出现。 分析 事实上是下拉框是出现了，只是被 <a-modal> 遮挡了。 原因是因为 select 的下拉框通过 .ant-select-dropdown 样式给到的 z-index ...

https://www.antdv.com/components/modal-cn/ 对话框基本使用 效果 设置对话框确认和取消按钮的文字 ok-text : 设置确认按钮文字 cancel-text : 设置取消按钮文字 例： 效果 对话框结合form表单使用 ...

不通过按键触发modal的方式（代码位于同一文本中）： modal中内容 在需要modal自动弹出的地方 如果需要对modal尺寸进行调整则将上述代码变为 margin-left：外边距，在此地为modal距离屏幕边缘，用于调整modal水平位置 ...

// modal对用户可见 $('.modal').on('shown.bs.modal', function () { modalOnResize(this); }) // 浏览器窗口大小改变事件 window.onresize = function(){ // 已显示 ...