触发Dialog中子组件方法,找不到方法问题
触发Dialog中子组件方法,找不到方法问题
问题来源
在做项目的时候我在父组件中放置一个dialog,dialog中又存放了子组件,当打开dialog的时候同时触发子组件中的方法,但是就在这个时候,它报了一个找不到子组件中方法的错误
问题原因
是因为DOM元素还没有渲染完成导致的,当我们把dialog的visible属性设置为true的时候,子组件正在加载,这个对话框及其里边的DOM元素是有一个渲染的过程的,所以这个时候就可能拿不到里面的元素
解决方法
使用nextTick()方法
nextTick()方法的作用:将回调延迟到DOM 更新循环之后执行。在修改数据时立即使用它,然后等待 DOM 更新,便可达到获取 更新后的节点 的目的。简单来说就是当界面完全渲染完之后,在进行操作。
如果不了解nextTick方法的可以点击这个链接 : nextTick()用法总结
我的解决方法:
<--! 在vue界面的watch属性中监控 dialogFormVisible 属性,放它发生改变时 界面打开dialog进行渲染,这个时候想拿到渲染完成之后的initParamHtmlSS方法,所以就把调用子组件方法写在this.$nextTick的回调函数里,而this.$nextTick回调函数是界面完全渲染完成以后调用,这样就一定能拿到子组件中的方法 -->
watch: {
dialogFormVisible(value) {
this.$nextTick(function() {
if (value) {
<--!这是我要调用子组件中的方法-->
this.$refs.paramDrawRef.initParamHtmlSS() // 前后加遮罩
}
})
}
}
分类:
遇到的问题
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】凌霞软件回馈社区,博客园 & 1Panel & Halo 联合会员上线
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】博客园社区专享云产品让利特惠,阿里云新客6.5折上折
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· Java 中堆内存和栈内存上的数据分布和特点
· 开发中对象命名的一点思考
· .NET Core内存结构体系(Windows环境)底层原理浅谈
· C# 深度学习:对抗生成网络(GAN)训练头像生成模型
· .NET 适配 HarmonyOS 进展
· DeepSeek+PageAssist实现本地大模型联网
· 手把手教你更优雅的享受 DeepSeek
· 腾讯元宝接入 DeepSeek R1 模型,支持深度思考 + 联网搜索,好用不卡机!
· 从 14 秒到 1 秒:MySQL DDL 性能优化实战
· AI工具推荐:领先的开源 AI 代码助手——Continue