antdv中的modal弹窗打开之后无法关闭

最新推荐文章于 2024-09-18 15:40:53 发布
最新推荐文章于 2024-09-18 15:40:53 发布
阅读量2.8k 收藏 12
点赞数 13
文章标签： vue.js javascript 前端
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_44689966/article/details/135572464
版权

修改vue的版本，固定为3.3.x
删除node_modules，删除package-lock.json
重新安装依赖
具体问题可以看这个官方issue
https://github.com/vueComponent/ant-design-vue/issues/7257

weixin_44689966
关注
react中使用ant组件库的modal弹窗报错
liguoyuan819的博客
05-06 1906
在react项目中使用ant-design库中的modal弹窗控制台报错 findDOMNode is deprecated in StrictMode. findDOMNode was passed an instance of DomWrapper3 which is inside StrictMode. 问题根因： react脚手架中开启了严格模式，限制代码书写规范。在ant-design组件库中使用了CSSTransition，但是CSSTransition中的部分代码的写法对于react
antd中Modal用Form表单填充，每次关闭时清空输入值
Voiceu的博客
04-08 3142
由于视频教程中用的antd版本还是低版本，当时还能用Form.create()方法，但是在本人学习的时候，该方法已经弃用，又觉得要解决问题，不能用降低版本的方式，既然弃用，肯定有新的解决方法，一味的跟视频模仿，学不了更多，首先看新版本的官方文档， Form中的api，暂时没有找到能解决的，能力有限 <Modal title="修改分类" visible={showStatus === 2} onOk={this.
解决Ant Design Vue使用Modal对话框无法关闭的问题，本地可以关闭对话框但是打包后不能关闭对话框的问题。
qq_43807473的博客
04-15 2523
解决Ant Design Vue使用Modal对话框无法关闭的问题，本地可以关闭对话框但是打包后不能关闭对话框的问题。首先说为什么会导致这个问题：因为现在vue官方的最新版本是3.4.x，可能是vue最新版本的部分代码与Ant Design不兼容导致的。次版本号的变化表示软件包具有新的功能，但是与之前的版本兼容。
关于ant design vue 使用Modal无法关闭弹窗的解决思路
weixin_44784401的博客
07-03 1470
关于ant design vue 使用Modal无法关闭弹窗的解决思路node_modules/.pnpm/pinia@2.1.7_typescript@5.5.2_vue@3.2.33/node_modules/pinia/dist/pinia.mjs:6:9: 6 │ import { hasInjectionContext, inject, toRaw, watch, unref, markRaw, effectScope, ref, isVue2,
解决Ant Design Vue使用Modal对话框无法关闭的问题《操作Dom不需要降低版本》
m0_53001289的博客
09-18 662
Ant Design Vue 使用 Modal.confirm 之类的静态方法 发现无法关闭弹窗，网上搜了好多都是降低版本，并锁定版本，但是目前在做的项目对UI样式要求很高，降低或者升级版本会导致部分样式不符合当前的UI规范，于是通过操作Dom的方式解决。如果一个页面既有 Modal.confirm （静态方法点击的弹窗） 又有 < a-modal >类的弹窗需改给 < a-modal > 加 v-if 例如。
AntDesignVue 的弹窗组件关闭不了model.confirm 不关闭
weixin_62273193的博客
05-20 943
AntDesignVue 的弹窗组件关闭不了model.confirm 不关闭。先查看node_modules里面的vue版本 ，果然是3.4xx版本，弹窗的突然就关闭不了，代码也没有修改，猜测是vue的问题，到处寻找。自己动手解决，安装vue版本小于的3.3都版本。vue3 和 antdesignvue的项目。在github上找到了解决方法，参考。大家如果遇到同样问题可以一起讨论！重新启动项目，可以成功关闭！
vue3.4 ant-design-vue的Modal.confirm无法关闭，需要将vue降为3.3
xixi4399的博客
01-11 1581
vue3.4 ant-design-vue的Modal.confirm无法关闭 需要将vue降为3.3
antd-vue 弹窗（modal）this.$confirm，不点击确定或取消按钮，关闭弹窗
热门推荐
YQxyqX555的博客
08-02 1万+
项目场景： 需求存在有一个全局最高层弹窗，点击跳转特定页面 问题描述： 使用modal，弹出的弹窗是通过v-model="visible"判断显示的，都可以在页面跳转后正常被关闭，但使用this.$confirm弹出的弹窗无法自动被关闭，则出现在特定页面出现上个界面的提示。 解决方案： 通过查看官方文档发现了destroy()的方法 则可以在data中定义modal，再使用 this.modal=this.$confirm({ title: “提示”, content: “确认要删除吗？”, onOk()
vue3 antd项目实战——Modal弹窗自定义遮罩 （利用maskStyle属性自定义遮罩样式）
XSL_HR的博客
01-13 4978
在后台管理系统的项目开发中，弹窗组件用到的地方很多。由于自带的默认样式不太符合视觉要求，因此需要利用maskStyle属性来自定义modal弹窗的遮罩样式。
Ant-Design modal对话框未打开时，无法通过uesRef获取modal内部元素DOM节点
Yabokusama的博客
03-31 1548
Ant-Design modal对话框未打开时，无法通过uesRef获取modal内部元素DOM节点
实现提示框可拖拽（针对antd vue中的a-modal提示框）
qq_51053759的博客
01-11 1980
在 utils 中新建 directives.js 文件 import Vue from 'vue' // v-drag-modal: 弹窗拖拽 Vue.directive('drag-modal', (el, bindings, vnode) => { Vue.nextTick(() => { let { visible, destroyOnClose } = vnode.componentInstance // 防止未定义 destroyOnClose 关闭弹窗时do
ant design vue Modal.confirm无法关闭的问题
TVM的博客
01-18 5342
使用ant design vue3.2.20版本的modal.confirm来生成提示框，但是无论是@ok还是@cancel都无法正常关闭提示框。甚至使用 Modal.destroyAll()都无法将其关闭，控制台也没报错。解决办法：当前vue版本是3.4.x，将版本降低至3.2.x，就可以正常将confirm关闭。
antdesign的modal.confirm突然无法自动关闭
weixin_45455337的博客
01-20 4772
它指示包管理器（如npm）可以安装与指定版本相同的主版本号（第一位数字）和次要版本号（第二位数字），但不包括修订版本号（第三位数字）之后的更新。例如，如果在package.json文件中指定了^3.2.0作为依赖版本号，那么包管理器将会安装3.2.x（包括3.2.0、3.2.1、3.2.2等）的版本，但不会安装3.3.0及以上的版本。这样做的目的是为了确保在包的后续版本发布时，能够自动安装向后兼容的更新，而不必手动更改版本号。另外也可能是vue3.4版本的原因，需要测试一下vue版本问题。
antd（5.x） Popover 的content有个modal，关不掉了
m0_57253767的博客
07-01 304
如上图所示，我的提示modal 关不掉了，思考问题症结在handleVisibleChange。修改逻辑如下，就可以正常关闭弹窗了。
【Ant Design of Vue】Modal.confirm无法关闭的bug
一只正在狂飙的肥兔
01-18 6827
在使用 Ant Design Vue 的 Modal.confirm 确认框时，出现了点击取消和确定后 Modal.confirm 确认框无法关闭的问题。
antd-vue的modal对话框关闭报错
qq_44242707的博客
05-31 2159
第三方库版本：Vue3、Antd3.2 现象：modal框点击关闭报错 原因：modal通过v-model绑定作为prop传入的visible时，modal内置方法将更新prop中的visible，这种直接修改prop的情况导致报错 解决方案：v-model:visible = “visible” => v-bind:visible = “visible” ...
《PC端UI框架》Ant Design V4 中的 Modal
花铛
09-22 411
Form表单： Form： form：经 Form.create() 包装过的组件会自带 this.props.form 属性。 layout：表单布局。 colon：配置 Form.Item 的 colon 的默认值 (只有在属性 layout 为 horizontal 时有效)。 labelAlign：label 标签的文本对齐方式。 labelCol：label 标签布局，设置 span offset 值。例如 {span: 3, offset: 12}。 wrapperCol：需要为输入控件设置布
antd $confirm无法关闭踩坑
m0_61837007的博客
06-08 2771
【代码】antd $confirm无法关闭踩坑。
Ant Design Vue中Modal.confirm无法自动关闭
一只生菜
08-26 462
Ant Design Vue中Modal.confirm无法自动关闭
antdv的modal打开弹窗就执行方法
最新发布
09-21
在Ant Design Vue (antdv) 中，Modal组件是用来创建弹出窗口的，它通常会在打开时默认只负责显示内容。如果你想在Modal打开时立即执行某个方法，你可以通过事件绑定或者在打开方法中调用这个方法。 1. **通过`v-on:open`事件**: 可以在Modal的`<el-dialog>`标签上绑定`@open`事件，并在其中执行你需要的操作。例如： ```html <template> <el-dialog v-model="dialogVisible" @open="onOpen"> <!-- Modal内容 --> </el-dialog> </template> <script> export default { data() { return { dialogVisible: false, }; }, methods: { onOpen() { // 这里是你想要在Modal打开时执行的方法 this.yourMethod(); }, yourMethod() { // 你的方法内容... } } }; </script> ``` 2. **在`open`方法中**：如果你的`open`方法本身包含这个操作，可以直接在那个方法里执行，比如： ```js methods: { openModal() { this.dialogVisible = true; // 打开Modal this.yourMethod(); // 执行方法 }, } ``` 在这里，当你调用`this.openModal()`时，Modal会同时打开并执行`yourMethod`。
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

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

余额充值