vue3中$refs使用调整

前言: vue3环境

在vue2环境中,可以直接通过this.$refs获取模块;在vue3环境中,通用以下两种方式获取:

1、通过声明ref进行获取;

TypeScript 复制代码
import { ref} from 'vue';
const logoForm = ref();
console.log(logoForm.value);

2、通过声明getCurrentInstance进行获取;

TypeScript 复制代码
import { getCurrentInstance } from '@vue/runtime-core';
const currentInstance = getCurrentInstance();
console.log(currentInstance.ctx.$refs.logoForm);
相关推荐
老华带你飞39 分钟前
校园快递|基于Java校园快递管理系统(源码+数据库+文档)
java·开发语言·数据库·vue.js·spring boot
苏打水com8 小时前
第九篇:Day25-27 Vue进阶——组件复用与状态管理(对标职场“复杂项目”需求)
前端·javascript·vue.js
老华带你飞8 小时前
博物馆展览门户|基于Java博物馆展览门户系统(源码+数据库+文档)
java·开发语言·数据库·vue.js·spring boot·后端
PineappleCoder8 小时前
别让页面 “鬼畜跳”!Google 钦点的 3 个性能指标,治好了我 80% 的用户投诉
前端·性能优化
卤代烃8 小时前
🕹️ [AI] Chrome DevTools MCP 原理分析
前端·mcp
梦里不知身是客118 小时前
flink对于迟到数据的处理
前端·javascript·flink
卤代烃8 小时前
🤝 了解 CDP (Chrome DevTools Protocol):browser-use 背后的隐藏功臣
前端·chrome·puppeteer
一 乐8 小时前
人事管理系统|基于Springboot+vue的企业人力资源管理系统设计与实现(源码+数据库+文档)
java·前端·javascript·数据库·vue.js·spring boot·后端
b***74889 小时前
前端状态系统的时代变革:从本地状态到全局状态,再到智能状态的未来趋势
前端·状态模式
秋氘渔9 小时前
Vue 3 组合式API中的生命周期钩子函数介绍
前端·javascript·vue.js