解决vue第一次弹窗以后第二次就不弹窗的问题

最新推荐文章于 2023-10-27 13:19:25 发布
最新推荐文章于 2023-10-27 13:19:25 发布
阅读量4.9k 收藏
点赞数 2
分类专栏： 学习笔记 文章标签： javascript 前端 开发语言
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/Mjxiaomihu/article/details/126234093
版权
本文探讨了Vue中弹窗组件未正确销毁导致二次打开不显示的问题。解决方案是使用v-if指令确保每次打开前组件已销毁，从而实现下次点击时的重新渲染。v-if在条件变化时对元素进行销毁和重建，确保了组件状态的正确管理。
摘要由CSDN通过智能技术生成

总结：

第一次弹窗后第二次没有弹的原因是组件没有销毁依然存在，所以当第二次打开弹窗的时候不会弹出，正确的做法是每次打开后都让它销毁下一次点击重新渲染，这里要用到v-if="XX"属性， 因为v-if在条件切换时，会对标签进行创建和销毁，当条件为true时渲染标签；如果不为真，则v-if不会去渲染。

小迷糊MJ
关注
专栏目录
vue 组件第一次不渲染问题_VUE的某些常见问题及解决方法
weixin_39738115的博客
12-28 3092
VUE的某些常见问题及解决方法双向绑定数据，界面未渲染？最近做vue项目的过程中，经常碰到会有双向绑定数据，data中定义的数据进行变动时，页面实际展示层未改变。常见的应用场景有下面几种：form表单里面，修改表单的时候，分明预置了数据，但是没有显示element-ui常用的select组件，下拉选择了一个元素，但是选中框中并没有显示自己写选中切换的组件，点击后触发active的样式，触发的字段为...
vue 组件第一次不渲染问题_解决vue页面渲染但dom没渲染的操作
weixin_39841136的博客
12-19 3064
我就废话不多说了，大家还是直接看代码吧~this.$nextTick(() => {$("select[name='ddlCostCenter']").select2({language: "zh-CN"});});补充知识：vue+Echarts动态数据已经赋值，但是无法渲染页面的问题最近用vue+Echarts想做一个饼状统计图，但是数据明明已经绑定完毕，但是页面渲染一直没有效果，最终才...
解决VUE-Router 同一页面第二次进入不刷新的问题
11-20
最近正好遇到一个问题，修改用户的头像，修改后再进入用户主页，发现改了之后即使数据变了。。页面也不会重新渲染。。。 下面提供几种解决方案来给予大家参考： 1. 可以在刷新的页面定义一个参数, 这样每次都会渲染出不同的页面： route 实例化命名配置： { // 用户信息 path: '/accountDetail/:randKey', name: 'accountDetail', component: accountDetail, meta: {requiresAuth: true} }, 跳转 的地方配置： var chars = ['0', '1', '
记录vue-element-template添加弹窗时，遇到的bug
ven_cy的博客
05-30 622
首先是遇到的bug是要点击按钮两次，才能显示弹窗，第一次点击如下图，灰色底色 第二次才能正常显示弹窗 解决方法： 如下图，在跳弹窗的按钮的相应代码前后，加上矩形方块内的代码，即可解决问题，原理我也不清楚... ...
Vue子组件封装弹窗只弹了一次,第二次进不去报错Avoid mutating a prop directly since vue.runtime,esm,js :4642 the value will
最新发布
m0_50981596的博客
10-27 447
vue是单向数据流，只能从父组件传递给子组件，子组件不可以直接在组件内部改变父组件通过props传递的值。
vue elementui的dialog弹出框，首次加载页面可以显示，第二次打开隐藏
guo0818的博客
08-28 1277
由于点右上角关闭按钮时不会触发handleCancel方法，改变visible的值，需增加。
vue +iview +modal 弹框关闭后再次打开不显示的问题
weixin_57005594的博客
11-12 3728
在做项目中再次遇到问题 1.问题环境：vue+iview 2.问题描述：将Modal对话框封装成一个子组件，在父组件引用，当对话框打开然后关闭，再次打开时对话框无法正常打开； ！！！3.解决： 搜索了好多例子，有的说props属性接收的值在子组件是无法改变的，因为v-model是双向绑定当对话框状态发生该变，props的值也会改变，这样会导致报错，但是实测过后发现并无报错。 排查问题后发现原来是在父组件给子组件传值是赋值发生了问题 父组件： 这个是在render函数里面写的，h,和params
vue simpletable 弹窗列表第二次显示不会加载问题
a445454545的专栏
10-15 789
做一个弹出模块， 弹出模块里面有列表 使用ant的simpletable，发现刷新页面后，点击查看，弹出该弹窗有查询后台显示，关闭弹窗后，换一个参数第二次打开不会调用后台，还是原来的列表数据。 解决方法： 在弹窗加载的方法里面 比如我这边是 show(){ this.$refs.table.refresh(true) } ...
Vue消息弹窗不重复弹出，只弹出一次
Mr_Chp的博客
01-27 4504
消息弹窗不重复弹出，只弹出一次 文章借鉴：让ElementUI Message消息提示每次只弹出一次 1、在utils里新建一个message.js 文件 /** * 重置message，防止重复点击重复弹出message弹框 * 用法: * main.js挂载：Vue.prototype.$messageSingle = message.success; * ———— this.$messageSingle.info("操作失败"); 或者 this.$messageSingle.info(
解决vue请求接口第一次成功,第二次失败问题
10-14
总的来说，解决Vue请求接口第一次成功、第二次失败的问题需要从多个角度排查，包括但不限于数据的正确管理、请求的类型和跨域策略。通过仔细分析请求和响应的细节，通常可以找到问题的根源并采取相应的解决措施。
解决父组件将子组件作为弹窗调用只执行一次created的问题
11-20
1、问题原因 因为第一调用渲染子组件后，不再对子组件的created进行调用 2、解决方法 用v-if将子组件包裹起来，因为v-if=false时可以将...以上这篇解决父组件将子组件作为弹窗调用只执行一次created的问题就是小编分享
vue 弹窗组件加载高德地图组件第一次不显示地图 第二次才显示怎么解决
06-09
这个问题可能是因为高德地图组件需要在弹窗组件显示时才能初始化，但是在第一次加载时弹窗组件可能还没有完全...以上三种方法都可以解决地图组件第一次不显示的问题，具体选择哪种方法取决于你的具体实现方式和需求。
vue中当界面第一次请求可以，但第二次请求接口数据加载不出来的解决方法用（reloader）
Sara0064的博客
05-20 8515
遇到一个问题，利用ant design中树形菜单去请求是，通过路由传递参数，第一次点击界面可以打开树形菜单，但是第二次请求数据就加载不过来了 当我点击查看后查看后跳转 第一次数据完全加载出来，但是第二次就没了， 在项目中App.vue中引入reload 注意：Vue 实现响应式并不是数据发生变化之后 DOM 立即变化，而是按一定的策略进行 DOM 的更新。 $nextTick 是在下次 DOM 更新循环结束之后执行延迟回调，在修改数据之后使用 nextTick，则可以在回调中获取更新后的DOM这里我们需
【vue】 Tinymce 数据 回显问题 | 第一次正常回显后面，显示空白bug不能编辑
amoureux555的博客
04-12 2654
【vue】 Tinymce 数据 回显问题 | 第一次正常回显后面，显示空白bug不能编辑
vue2.0中集成并使用ueditor，解决第一次编辑器正常加载，第二次就不加载的问题，父组件调用子组件的方法
chuxialia的博客
12-27 1479
vue2.0中集成并使用ueditor，解决第一次编辑器正常加载，第二次就不加载的问题，父组件调用子组件的方法
element-ui 弹窗里面嵌套弹窗，解决第二个弹窗被遮罩层掩盖无法显示的问题
锦瑟年华L的博客
08-28 4813
具体使用就是在第一个弹窗中设置 :modal-append-to-body="false" ，在第二个弹窗中设置 :append-to-body="true"我们可以把两个弹窗平级写在主页面中，并同时给2个弹窗设置 :append-to-body="true"这样就能实现我们想要的效果了。
Vue在一个页面中引入另一个弹窗页面
青莳的博客
05-26 3066
在 PromotionDialog.vue 文件中，编写 Vue 模板代码，并将 放置在其中。同时，将 selectPromotion 方法移动到该组件中，以便在需要时触发对话框的显示。在需要使用对话框的页面中，引入并使用 PromotionDialog 组件，并调用该组件中的 selectPromotion 方法来显示对话框。现在，你可以在一个页面中使用独立的组件来显示弹窗，而不需要跳转到新的页面。对话框仍然属于上一个页面，但通过独立的组件实现了逻辑上的分离和复用。
页面弹出对话框第二次弹出时不重新加载数据的解决方法
weixin_30455661的博客
06-17 947
页面弹出对话框第二次弹出时不会重新加载数据，像是取的浏览器缓存中的数据，所以数据可能有问题，不是最新的，所以在调用弹出页面的URL后面加个随机的参数，这个IE就会认为这是个新页，（页面URL?Random=随机数），就会重新去取数据。 转载于:https://www.cnblogs.com/qqhepp/articles/2083594.html...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值