vue3+ts+setup获取全局变量getCurrentInstance

2023-11-04

前言:

        vue3的 setup中是获取不到this的,为此官方提供了特殊的方法,让我们可以使用this,达到我们获取全局变量的目的,但是在使用typescript的时候,就会有一些新的问题产生,这里来做一个整理。

vue3官方提供的方法

1、引入方法

import { getCurrentInstance } from 'vue'

2、定义变量,接到我们的方法

setup() {
    const { proxy } = getCurrentInstance()
}

3、main.js中定义我们的全局变量

app.config.globalProperties.$api = '111'

4、页面中使用我们的全局变量

setup() {
    const { proxy } = getCurrentInstance()
    console.log(proxy.$api)
}

vue3+ts 使用官方方法遇到的问题:

Property 'proxy' does not exist on type 'ComponentInternalInstance | null'

 我在网上找的方法:网上资料入口

import { ComponentInternalInstance, getCurrentInstance } from 'vue';
// 添加断言
const { proxy } = getCurrentInstance() as ComponentInternalInstance

效果:不识别这种写法,不清楚是什么问题。多方尝试无果

最终我解决问题的方法:

        我把类型换成any,结果成功了,不知道原因,以后在查查资料

setup() {
   const { proxy } = getCurrentInstance() as any
}

 

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

vue3+ts+setup获取全局变量getCurrentInstance 的相关文章

随机推荐

  • uni-app的Vue.js实现微信小程序的紧急事件登记页面功能

    主要功能实现 完成发生时间选择功能 用户可以通过日期选择器选择事件发生的时间 实现事件类型选择功能 用户可以通过下拉选择框选择事件的类型 添加子养殖场编号输入框 用户可以输入与事件相关的子养殖场编号 完成事件描述输入功能 用户可以通过文本输
  • 1、网易校招2016年《下厨房》

    题目描述 牛牛想尝试一些新的料理 每个料理需要一些不同的材料 问完成所有的料理需要准备多少种不同的材料 输入描述 每个输入包含 1 个测试用例 每个测试用例的第 i 行 表示完成第 i 件料理需要哪些材料 各个材料用空格隔开 输入只包含大写
  • 数据分析实战项目:SQL分析淘宝用户行为

    文章目录 一 项目背景及目的 1 1 项目背景 1 2 项目目的 1 3 数据集来源与介绍 二 数据导入 2 1 图形界面工具导入 2 2 以系统命令行导入 三 数据清洗 3 1 删除重复值 3 2 查看缺失值 3 3 时间格式转换 3 4
  • 赛宁网安有力保障淮安市网络安全技能竞赛决赛

    9月6日 由中共淮安市委网信办 淮安市总工会 淮安市人社局 淮安市教育局 淮安市公安局 共青团淮安市委共同主办 淮阴工学院协办 淮安市网络信息和数据安全协会 淮安市信息安全等级保护工作协调小组办公室承办 中国电信股份有限公司淮安分公司 中国
  • stm32 无刷电机控制板

    stm32f103c8t6 做主控 自制无刷电机 bldc 控制板 支持有感和无感两种模式 可通过硬件切换 内部包含原理图和源代码及照片 文件 url80 ctfile com f 25127180 745426979 e8e3fc p 5
  • Acesrc and Hunting【模拟 贪心】

    HDU 6660 题目链接 这道题主要就是讲我们从任意点出发 每次走的都是没走过并且 曼哈顿距离大于1小于3的点 然后问能不能覆盖完整幅图 这里就想到一个很经典的问题 4399小游戏除草游戏 以前玩过的一个小游戏倒是让我对这道题的解法有了方
  • 动手学数据分析 Task4

    动手学数据分析 Task4 一 可视化展示泰坦尼克号数据集中男女中生存人与死亡人数的比例图 二 可视化展示泰坦尼克号数据集中不同票价的人生存和死亡人数分布情况 三 可视化展示泰坦尼克号数据集中不同年龄的人生存与死亡人数分布情况 一 可视化展
  • Maven的基础知识

    Maven介绍 Maven 是一个项目管理和 综合工具 Maven 提供了开发人员构建一个完整的生命周期框架 开发团队可以自动完成项目的基础工具建设 Maven 使用标准的目录结构 和 默认构建生命周期 Maven是什么 它是一个 Apac
  • 各种绕过(MD5

    文章目录 MD5 0e开头的数组 MD5弱比较 MD5数组绕过 MD5 SQL注入 SHA1 SHA1弱比较 和 MD5弱类型比较同理 SHA1碰撞 MD5 0e开头的数组 MD5弱比较 QNKCDZO 240610708 byGcY so
  • 表设计为什么主键尽量无意义_奉上数据库表设计的十三条建议

    前言 本文总结了数据库表设计的十三条建议 这十三条建议只作为大家的参考 具体需要根据自己的项目来设计 来自 梦尘啊 链接 https juejin cn post 6902236691348586510 1 原始单据与实体之间的关系 表的设
  • Go:go mod vendor 使用

    Go go mod vendor 使用 1 背景 我们基于 go mod 机制来管理我们项目的依赖库版本 其中 go mod 记录了依赖库版本信息 一般第三方依赖库 包括公司内网gitlab上的依赖库 其源码都不被包含在我们的项目内部 而是
  • 5.自动装配:autowire=“byName“ or “byType“ + 使用注解【@Autowired 、@Qualifier、 @Resource】

    文章目录 自动装配说明 本博客环境搭建 自动装配 autowire byName 按名称自动装配 autowire byType 按类型自动装配 使用注解 1 Autowired 按类型自动转配的 不支持id匹配 2 Qualifier 不
  • hypertable管理当前rangserver和历史rangserver

    purge old log files void OperationRecoveryBlocker execute HT INFOF Entering RecoveryBlocker lld threadid d Lld header id
  • Docker安装

    镜像 Docker 镜像 Image 就是一个只读的模板 镜像可以用来创建 Docker 容器 一个镜像可以创建很多容器 它也相当于是一个root文件系统 比如官方镜像 centos 7 就包含了完整的一套 centos 7 最小系统的 r
  • ns2编程小技巧(转)

    1 tcl脚本传入一个int变量给c 代码在command解析里 int nodenum atoi argv 2 printf d nodenum 2 在nam中输出结果 Tcl instance evalf ns trace annota
  • Ubuntu下配置VScode及LeetCode,开始撸代码

    Ubuntu20 04下配置VScode及LeetCode 开始撸代码 一 配置VScode环境 1 软件下载 2 软件安装及启动 3 C 基础插件的安装 4 配置软件内部Debug 5 配置内部Debug工具时的异常 正常请跳过此步 6
  • JS获取本地图片和网络图片的宽高尺寸和存储大小

    最新更新时间 2020年07月08日09 13 28 猛戳 查看我的博客地图 总有你意想不到的惊喜 本文内容 图片作为一种记录信息的载体 比文本更加生动 比视频更加精简 在日常生活中的用处很大 作为前端开发人员 操作图片的场景非常多 本文记
  • 跨域产生原因和跨域解决方案

    一 为什么会出现跨域问题 出于浏览器的同源策略限制 同源策略是一种约定 它是浏览器最核心也就是最基本的安全功能 如果缺少了同源策略 浏览器的正常功能会受到影响 可以说WEB是构建在同源策略基础之上的 浏览器只是针对同源策略的一种实现 同源策
  • 有限元方法的核心思想是什么?

    有限元方法的核心思想是什么 有限元方法似乎是在不断地简化着什么 请问有限元方法的核心思想是什么 在哪些层面对方程做了简化 每一次简化的依据和思路是什么 2 条评论 按投票排序 按时间排序 31 个回答 菲兹 睡眠厌倦患者 138 人赞同 有
  • vue3+ts+setup获取全局变量getCurrentInstance

    前言 vue3的 setup中是获取不到this的 为此官方提供了特殊的方法 让我们可以使用this 达到我们获取全局变量的目的 但是在使用typescript的时候 就会有一些新的问题产生 这里来做一个整理 vue3官方提供的方法 1 引