vue中el-dialog 中的内容没有预先加载,因此无法获得内部元素的ref 的解决方案 使用强制提前加载dialog方法

问题描述

在没有进行任何操作的时候,使用

复制代码
this.$refs.xxxx 

无法获取el-dialog中的内部元素,这个问题会导致很多bug,其中目前网络上也有许多关于这个问题的解决方案,但是大多数是使用el-dialog中的@open在dialog打开的时候使用this.$nextTick进行操作

如果你想用上面的方法,可以参考https://blog.csdn.net/weixin_43227235/article/details/130849126

这里介绍另一种解决方法,强制加载dialog中的内容

给dialog添加一个ref

使用下面的代码,就是将dialog强制加载一遍,这个因为速度快肉眼是看不见加载的过程的

复制代码
mounted() {
    this.updateInsertOpen = true //:visible.sync="open"
    this.$refs.updateInsertDialog.rendered = true //updateInsertDialog是dialog的ref;
    this.updateInsertOpen = false
  },
相关推荐
梦梦代码精13 小时前
2026年PHP开源商城系统实测对比:架构、多商户、商用授权,谁才是真·省心?
vue.js·docker·架构·开源·代码规范
threelab13 小时前
Three.js 物理模拟着色器 | 三维可视化 / AI 提示词
开发语言·前端·javascript·人工智能·3d·着色器
武器大师7213 小时前
lv_binding_js 代码解读
开发语言·javascript·ecmascript
Patrick_Wilson14 小时前
router.replace 之后紧跟 reload,页面为什么无限刷新?
javascript·react.js·浏览器
mONESY16 小时前
JavaScript 栈、队列、数组与链表核心知识点总结
javascript·面试
ZengLiangYi16 小时前
TypeScript 项目配置:tsconfig、ESM、路径别名
javascript·typescript·aigc
晓131316 小时前
【Cocos Creator 3.x】篇——第二章 入门
前端·javascript·游戏引擎
想要成为糕糕手16 小时前
前端必修课:JavaScript 数组与数据结构底层逻辑全解析
javascript·数据结构·面试
xiaofeichaichai17 小时前
React Hooks
前端·javascript·react.js
数据知道17 小时前
C++ 层拦截:修改 Blink 引擎与 V8 绑定的底层逻辑
javascript·数据采集·指纹浏览器·风控