el-dialog的内容不刷新；el-dialog内容有缓存；el-dialog里面的组件不刷新问题；

最新推荐文章于 2024-03-30 09:42:06 发布
最新推荐文章于 2024-03-30 09:42:06 发布
阅读量3k 收藏 4
点赞数 1
分类专栏： element-ui 文章标签： element-ui el-dialog的内容不刷新 el-dialog内容有缓存 el-dialog组件不刷新
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/i_am_a_div/article/details/127509901
版权

el-dialog里面的内容是带缓存的，也就是说除了第一次打开会初始化，其他次打开都是直接加载缓存的； 这就导致了有时候打开弹框时候，内容不刷新。有说法说是el-dialog嵌套太深大致的。

解决方法：直接给弹框的内容部分添加v-if
在这里插入图片描述

i_am_a_div_日积月累_
关注
  • 1
    点赞
  • 踩
  • 4
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
element UI组件库el-dialog内程序刷新el-dialog内组件方法
09-15 3530
element UI组件库el-dialog内程序刷新el-dialog内组件方法
el-dialog 关闭再打开后窗口内容不刷新问题
最新发布
violet217的博客
04-09 677
el-dialog 关闭再打开后窗口内容不刷新问题。
点击相同按钮弹出el-dialog，第二次之后重新打开，不会更新查询数据问题
L19910311的博客
08-03 603
v-if重新渲染el-dialog组件，多次点击，每次都会重新查询
4种方案教你彻底解决vue + el-dialog的model的状态已经改变但是却不显示弹窗,×号点击后异常无法显示弹框
tangdou369098655的博客
02-22 1836
如果你是VUE2.X，请检查你是否在:visible这个属性上加.sync，就像这样:visible.sync=“dialogVisble”，vue3应该是v-model的绑定方式，请去查文档~如果方案1没有解决，可以尝试将x号绑定和取消一样的方法来进行关闭。找到元素，手动在dom里面把mask的display改成show。欢迎大家指出文章需要改正之处~
element-ui el-dialog 缓存清理
luning95的专栏
11-17 765
<el-dialog></el-dialog>
关于Vue Dialog弹框中使用数据不刷新问题解决
QueenLee1的博客
08-18 4314
做vue项目的坑一直很多,有的是element-ui组件自带坑,有的是vue机制问题,但是除了各种坑以外,对vue还是很喜爱的. 其实也很简单,在弹框关闭时,清空数据,就可以解决
elementui 再次打开dialog，绑定的数据没有更新
水镜先生的博客
07-04 702
主要是因为dialog再次打开时不会重新渲染dom，只是简单的显示隐藏，所以第一次打开绑定值后，关闭再打开则不会走created和mounted生命周期，解决办法是在外层套一层div，用v-if控制。我在dialog中弄了一些表单，然后做了一个组件请求了一个内容后做了下拉的选择。但是让我奇怪的是，关闭dialog再次打开的时候就没有重新发送下拉的请求。在dialog中加了如下代码，这样dom节点就会重新生成了。
dialog 内组件数据刷新延迟
xfWgaoqiang的博客
12-28 527
<el-dialog :destroy-on-close="true" top="5vh" width="80%" title="流程图操作工具：鼠标右键" :visible.sync="dialogTableVisible"> <flow-chart :dialogNodes="dialogNodes" :key="timer1"></flow-chart> </el-dialog> 组件上添加 :key="timer1" .
el-dialog 中修改了 el-table 的数据，但是没有提交到后端，导致前端页面数据已经发生了变化，但是后端数据还没有更新过来，出现了数据不同步的情况。
weixin_45884508的博客
03-27 510
如果要提交的 state 中的数据是一个引用类型的数据，如数组或对象，则应该使用 Vue 的响应式数据更新工具方法进行更新，例如 Vue.set、Vue.delete 方法等。否则，在数组或对象中所做的更改将被视为突变，并且不会触发 Vue 的响应式系统来更新组件中的数据。解决这个问题，需要在确认提交前对数据进行校验，保证数据的正确性和一致性。具体方法可以使用 Vuex 来对数据进行管理和提交，保证数据的统一性和同步性。
el-dialog的子组件不刷新
weixin_47323421的博客
05-08 525
加入一个div v-if实现el-dialog刷新
elementui更改el-dialog关闭按钮的图标d的示例代码
10-15
在Element UI框架中，`el-dialog` 是一个用于创建弹出式对话框的组件，它在用户界面中常用于显示重要信息或者进行确认操作。在某些设计需求下，可能需要自定义`el-dialog`的关闭按钮图标以符合特定的品牌风格或者...
基于element-ui对话框el-dialog初始化的校验问题解决
10-14
在使用Element-UI框架开发前端应用时，遇到的一个常见问题是关于`el-dialog`对话框的初始化校验问题。`el-dialog`是Element-UI提供的一个模态对话框组件，它通常与`el-form`结合使用，用于数据输入和验证。然而，当...
element ui 对话框el-dialog关闭事件详解
08-27
下面小编就为大家分享一篇element ui 对话框el-dialog关闭事件详解，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
Dialog组件不刷新的问题
LAHM8963的博客
01-04 1624
同时监听visible和name的变化，只要弹窗打开，便获取设备名称，然后执行逻辑函数，问题解决。
解决vue使用el-dialog中组件只有第一次执行mounted方法的问题(编辑成功后, 数据列表不刷新最新数据,只能刷新页面才能正常使用)
一方湖泊
12-08 3022
问题描述 打开编辑页面或模态框(Edit.vue), 编辑完成后, 数据修改成功, 跳转到列表页(Index.vue)后, 不刷新最新的数据, 只能刷新页面才能正常使用.     原因 vue使用el-dialog中组件,第二次打开没有执行组件内mounted的初始化方法，只能刷新页面才能正常使用     解决方法 editDialog是控制打开el-dialog弹窗的标志 data() { return { formFields: .
[已解决]Vue3+Element-plus使用el-dialog对话框无法显示
bfbshs_ddd的博客
03-30 1884
开发时，发现点击按钮不能显示想要的对话框，发现这与组件层级有关系
成功解决：el-dialog弹出窗口、数据第一次没有加载、第二次打开才能加载数据。（每次页面刷新后、第一次打开dialog窗口、图片数不加载）
做笔记\记录遇到的程序bug
10-13 1672
在查看图片的时候、点击预览按钮，将图片放入dialog弹出框中。然而每次页面刷新、首次预览图片、打开的窗口中并没有图片展示？？？
DWZ中刷新dialog的方案解决
weixin_33709364的博客
10-03 261
在DWZ中进行ajax表单提交后，通过回调函数来返回状态结果，以及返回是否需要刷新父页的navTabId。 DWZ给我们提供了两个回调函数，一个是子窗口为navTab的navTabAjaxDone，一个是子窗口为dialog的dialogAjaxDone，但这两个回调函数都有同一样的缺陷：就是父窗口必须是navTab,也就是说只能刷新navTab,如果父窗口为dialog,则此父dialog是刷...
vue中el-dialog套el-dialog打不开的问题
11-22
根据提供的引用内容，el-dialog是element ui中的一个对话框组件，而el-dialog套el-dialog打不开的问题可能是由于以下原因导致的： 1. el-dialog的z-index值设置过小，导致被套在了其他el-dialog的下面，无法显示出来。 2. el-dialog的open属性没有正确绑定，导致无法打开。 3. el-dialog的visible属性没有正确绑定，导致无法显示。 解决这个问题的方法有以下几种： 1. 确保每个el-dialog的z-index值都不同，可以通过在样式中设置z-index值来实现。 2. 确保每个el-dialog的open属性都正确绑定到不同的变量上。 3. 确保每个el-dialog的visible属性都正确绑定到不同的变量上。 下面是一个示例代码，演示如何在vue中使用el-dialog组件： ```html <template> <div> <el-dialog :visible.sync="dialogVisible" title="对话框1"> <p>这是对话框1的内容</p> <el-button type="primary" @click="openDialog2">打开对话框2</el-button> </el-dialog> <el-dialog :visible.sync="dialogVisible2" title="对话框2"> <p>这是对话框2的内容</p> </el-dialog> </div> </template> <script> export default { data() { return { dialogVisible: false, dialogVisible2: false }; }, methods: { openDialog2() { this.dialogVisible2 = true; } } }; </script> ```

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

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

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值