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
  },
相关推荐
WYiQIU4 小时前
11月面了7.8家前端岗,兄弟们12月我先躺为敬...
前端·vue.js·react.js·面试·前端框架·飞书
娃哈哈哈哈呀5 小时前
formData 传参 如何传数组
前端·javascript·vue.js
513495926 小时前
Vite环境变量配置
vue.js
2503_928411567 小时前
11.24 Vue-组件2
前端·javascript·vue.js
g***B7388 小时前
JavaScript在Node.js中的模块系统
开发语言·javascript·node.js
Z***25808 小时前
JavaScript在Node.js中的Deno
开发语言·javascript·node.js
weixin79893765432...8 小时前
Vue + Express + DeepSeek 实现一个简单的对话式 AI 应用
vue.js·人工智能·express
高级程序源8 小时前
springboot社区医疗中心预约挂号平台app-计算机毕业设计源码16750
java·vue.js·spring boot·mysql·spring·maven·mybatis
cypking9 小时前
Vue 3 + Vite + Router + Pinia + Element Plus + Monorepo + qiankun 构建企业级中后台前端框架
前端·javascript·vue.js
San30.9 小时前
ES6+ 新特性解析:让 JavaScript 开发更优雅高效
开发语言·javascript·es6