当前位置： 首页 > news >正文

vue3指定设置了dom元素的ref但是为null问题

news 2025/8/5 6:14:45

目录

问题场景

​编辑问题原因

解决方案

问题场景

可以看到我指定了元素的ref，正常来说在组件挂载完毕后可以通过ref.value正常获取到dom元素

但是实际打印出来为null

问题原因

根本原因就是v-if指令的问题，v-if指令能够控制元素是否渲染，这个数组的数据是从接口获取的，但是接口调用的时机是在onMounted之后，所以组件在onMounted之后等到接口响应拿到数据后才会渲染，错过了vue把元素dom设置ref指定变量的时机。

解决方案

 使用v-show指令代替v-if即可

 

http://www.lryc.cn/news/609479.html

相关文章：

  • 大模型 与 自驾 具身 3D世界模型等相关知识
  • 华为OD机考2025C卷 - 最小矩阵宽度（Java Python JS C++ C ）
  • vim 组件 使用pysocket进行sock连接
  • 408数据结构排序部分知识的复盘：从原理到辨析的系统化梳理
  • 抗辐照DCDC与MCU在核环境监测设备中的集成应用
  • 远程测控终端RTU:工业物联的“神经末梢”与远程操控核心
  • CVPR论文解析：告别Janus问题，text-to-3D更一致！
  • 5G专网与SD-WAN技术融合：某饮料智能工厂网络架构深度解析
  • Planner 5D v2.29.0 安卓高级解锁版，手机3D家装，全套家具免费
  • 【基于WAF的Web安全测试：绕过Cloudflare/Aliyun防护策略】
  • iOS混淆工具有哪些？功能测试与质量保障兼顾的混淆策略
  • SpringBoot3.x入门到精通系列：3.2 整合 RabbitMQ 详解
  • mac 锁屏不断网 2025
  • Java基础-斗地主游戏
  • 亚马逊撤离Google购物广告：重构流量生态的战略博弈
  • 编译 Paddle 遇到 flashattnv3 段错误问题解决
  • 37. line-height: 1.2 与 line-height: 120% 的区别
  • YAML文件
  • Vue Router快速入门
  • 高精度实战：YOLOv11交叉口目标行为全透视——轨迹追踪×热力图×滞留分析（附完整代码）
  • 深度学习TR3周：Pytorch复现Transformer
  • 第三阶段—8天Python从入门到精通【itheima】-143节（pyspark实战——数据计算——flatmap方法）
  • 大型语言模型落地应用全景指南：微调、提示工程、多模态与企业级解决方案
  • Perl 面向对象编程深入解析
  • 如何计算卷积层的计算量？从参数到公式的详细推导
  • PPT自动化 python-pptx - 11 : 备注页 (Notes Slides)
  • JUCE VST AI 开源
  • 进程生命周期管理：从创建到终止的完整逻辑
  • 解锁高并发LLM推理：动态批处理、令牌流和使用vLLM的KV缓存秘密
  • Oracle ASH的手册