引用window自定义变量以及ts在window上自定义变量数据类型报错的解决方案

2023-11-15

一、问题描述 

举个例子,在TypeScript中,当我们需要给window对象添加全局变量(如testName),或者需要使用window下自定义创建的变量(以testName为例)。会出现以下ts报错:类型“Window & typeof globalThis”上不存在属性“testName”。产生类型报错的原因是因为window数据类型定义如下:

declare var window: Window & typeof globalThis;

二、解决方案

1、增加自定义属性声明,在类型声明文件typings.d.ts中,增加如下声明

interface Window {
  testName: string;
}

2、将window类型强制转换为any

(window as any).testName

3、使用方括号

window['testName']

【推荐文章】

微前端系列讲解--应用集成方案(qiankun+umi+vue)https://blog.csdn.net/w544924116/article/details/120105320antd pro项目使用qiankun,loading加载页不消失https://blog.csdn.net/w544924116/article/details/120164997antd pro(ProLayout) mix混合菜单不生效https://blog.csdn.net/w544924116/article/details/120211891Error: Module “xxx“ does not exist in container. / antd pro v5启用qiankun报错 / 同时使用mfsu和qiankun报错https://blog.csdn.net/w544924116/article/details/120123331

感谢您读完本文!如果本文对您有帮助,请点个赞呗,您的点赞是对我最大的支持和认可!

我的公众号:大前端教程,欢迎关注,会定期更新前端知识,希望能帮到您。

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

引用window自定义变量以及ts在window上自定义变量数据类型报错的解决方案 的相关文章

  • protobuf数据类型

    四 限定符 required optional repeated 的基本规则 1 在每个消息中必须至少留有一个required类型的字段 2 每个消息中可以包含0个或多个optional类型的字段 3 repeated表示的字段可以包含0个
  • TypeScript学习(四):对象的定义及使用

    前面我们说到了数据类型 像什么布尔类型 数值类型 字符串类型等等 在开发中 我们还会遇到很多像对象 数组 函数等类型 那么在typescript中是怎么定义这些类型的 对象 object 我们先介绍下在JavaScript中式怎么定义对象的
  • Windows搭载TS环境

    好久没写代码了 想把TS拾起来 然后就忘记了TS这么搭载了 又重新搜了一遍攻略 还遇到了一些问题 才想起来要把他记录下来 以防下次再用 工具下载 VS code 编辑器 node js 链接 http nodejs cn 这里可能出现的问题
  • TypeScript中的递归类型简析

    在这篇博客中 我们将深入探讨TypeScript中的递归类型 递归类型是一种非常强大的功能 它允许我们对具有自相似结构的数据进行更精确的类型建模 我们将通过多个示例来展示递归类型的用法 并对每个示例进行详细的讲解 什么是递归类型 递归类型是
  • React中 useState在合成事件中是异步的,怎么获取到useState 设置后的最新值,或者说setState中获取到最新值

    useState 在合成事件中是异步的 合成时间是什么呢 合成事件 简单来说 比如onClick 或者 onChange 或者说是 Input之类的事件 所以一个情景是这样的 当你在onClick 中这样设置了状态 并赋值上去 但是打印的值
  • TypeScript的基础类型

    1 boolean类型 boolean表示布尔值类型 即true和false 例 let isDone boolean false 2 number类型 number表示数字类型 包括整数和浮点数 例 let decimal number
  • TypeScript中数组类型的定义

    TypeScript中数组类型的定义 现在我们可以定义一个最简单的数组类型 比如就是数字类型 那么就可以这么写 const numberArr 1 2 3 这时候你把鼠标放在numberArr上面可以看出 这个数组的类型就是 number
  • TypeScript中的模块与命名空间

    一 模块 在TypeScript中 模块是一种组织和封装代码的方式 模块使得代码可以按照特定的规则划分为不同的文件 并且可以在这些文件之间进行导入和导出 从而实现代码的重用和组织 1 默认导入导出 默认模块导出是一种特殊的导出语法 在一个模
  • ffmpeg的使用

    目录 ffmpeg的下载 配置 下载 版本说明 环境变量配置 ffmpeg处理m3u8 ts的常用命令 ffmpeg是一个十分强大的音视频处理工具 提供转码 播放等基础功能 功能十分全面 强大 但命令繁多复杂 通常不直接使用 而是集成在带G
  • Numpy下dtype中的str_与string_的区别

    为什么写这篇文章呢 其实简单来说就是因为搜不到别人有这类的文章呗 所以自己研究了一下 在我的某个程序中需要将数据保存成numpy数组 数组中每个元素又必须是字符串的格式 但是当你输入dtype numpy str的时候 你会发现又三个相近的
  • Vue3头像(Avatar)

    效果如下图 在线预览 APIs 参数 说明 类型 默认值 必传 shape 指定头像的形状 circle square circle false size 设置头像的大小 number large small default Respons
  • javascript的null、undefined和布尔数据类型

    javascript中 有null undefined 在使用typeof 时候 console log typeof null object console log typeof undefined undefined null与unde
  • 【HIT-计算机系统】ICS-Lab2 DataLab

    第1章 实验基本信息 1 1 实验目的 熟练掌握计算机系统的数据表示与数据运算 通过C程序深入理解计算机运算器的底层实现与优化 掌握VS CB GCC等工具的使用技巧与注意事项 1 2 实验环境与工具 1 2 1 硬件环境 x64 CPU
  • vue3+vite的项目中实现右键事件的神器

    前言 vue3 vite的项目中实现右键事件的神器 imengyu vue3 context menu 实现效果 使用步骤 1 安装 npm cnpm pnpm yarn 都可以 装上下面插件 imengyu vue3 context me
  • TypeScript中的对象类型(可选属性 只读属性 交叉类型)

    一 定义对象类型 在TypeScript中定义对象类型有以下三种方式 1 匿名对象类型 匿名对象类型是在定义变量时直接使用花括号 来定义一个对象类型 例如 const person name string age number name J
  • java中的类型赋值常见错误

    Java中float double long类型变量赋值添加f d L尾缀问题 添加尾缀说明 我们知道Java在变量赋值的时候 其中float double long数据类型变量 需要在赋值直接量后面分别添加f或F d或D l或L尾缀来说明
  • java中的八种数据类型、变量与常量

    内存空间所占字节数 8位等于1字节 数值型 1 整数类型 byte 1 short 2 int 4 long 8 2 浮点类型 float 4 double 8 字符型 char 2 布尔型 boolean 1或4 取值范围 byte 12
  • vue3+ts实现todolist功能

    先看一下实现效果 可以看到内部实现的内容有enter输入 单项删除 全选 以及删除选中项等功能 具体在实现前需要常见有ts的vue3项目 项目创建 具体项目创建 就是 vue create 项目名称 在创建后 选择的时候有vue2和vue3
  • typeScritp的高级函数

    1 交叉类型 交叉类型是将多个类型合并为一个类型 这让我们可以把现有的多种类型叠加到一起成为一种类型 它包含了所需的所有类型的特性 例如 Person Serializable Loggable同时是 Person 和 Serializab
  • 【Umi+Antd+Ts实战】新增商品弹框组件【V1.0】

    新增商品弹框组件 先看效果 1 点击 符号 弹出新增商品组件 路由配置可以参考下面博客 https blog csdn net weixin 43352901 article details 108536112 2 新增商品弹框内容 文件目

随机推荐

  • pycharm错Error updating package list: connect timed out误:解决(更换镜像源)

    问题 可能是网络问题 导致无法加载 报错 Error updating package list connect timed out 解决 File setting project interpreter 加号 manage reposit
  • vmware+CentOS5.0上安装oracle 10g数据库

    一 针对 Oracle 配置 Linux Linux 软件现已安装完毕 您需要针对 Oracle 对其进行配置 本部分将逐步讲解针对 Oracle 数据库 10g 配置 Linux 的过程 验证系统要求 要验证系统是否满足 Oracle 1
  • Docker简介以及安装使用(一)

    疫情下的上海 按下了暂停键 期待早日重回繁华 上海加油 文章目录 Docker简介 Docker的出现 Docker的优点 Docker的局限性 Docker架构 Docker的安装 Docker简介 Docker 是一个开源的应用容器引擎
  • 反馈判断方法

    负反馈放大器可组合成四种类型 即 电流串联 电流并联 电压串联 电压并联四种负反馈类型 正负反馈的判断 正负反馈的判断使用瞬时极性法 瞬时极性是一种假设的状态 它假设在放大电路的输入端引入一瞬时增加的信号 这个信号通过放大电路和反馈回路回到
  • 设计模式--Template模式 VS Strategy模式

    Template 模式和Strategy模式所要解决的问题类似 而且通常可以互换使用 Template模式使用继承来解决问题 Strategy模式使用委托来解决问题 如图1 template 模式 基类 BubbleSorter实现了通用算
  • 钉钉小程序头像剪切并压缩上传

    引入方式 json文件 usingComponents dd cropper components dd cropper dd cropper axml
  • 个人支付接口

    分享个人可以用的支付接口 用来实现收款实时回调 不用企业资质 不用签约 很方便 1 接口地址 请求地址 https www gogozhifu com shop api createOrder 2 注意事项 数据编码统一为utf 8 Req
  • 仿滴滴打车百度地图定位查找附近出租车或门店信息

    随着技术的发展 开发的复杂度也越来越高 传统开发方式将一个系统做成了整块应用 经常出现的情况就是一个小小的改动或者一个小功能的增加可能会引起整体逻辑的修改 造成牵一发而动全身 通过组件化开发 可以有效实现单独开发 单独维护 而且他们之间可以
  • 前置++与后置++区别 以及效率

    之前在杭州实习面试中科视拓时候面试官问道 前置 与后置 区别 以及效率 打破对C 的认识 后来 寒假回来看书后才恍然大悟 前置 和后置 的区别 C专家编程 中有如下描述 P276 人民邮电出版社 a表示取a的地址 增加它的内容 然后把值放在
  • 2021-Linux系统与管理 - (二)Linux系统命令【超详细】

    自说 Linux命令 Linux命令行的格式 Linux系统的基本命令 自说 学习Linux必定要学习的就是命令了 凡事都是一步一个脚印 这样才踏实 呢么在学习Linux这条道上 我们更加要循序渐进 先学会走再勇往直前 以下便是Linux命
  • 【Mysql】图解左、右、内与全连接

    一 前言 使用学生表与成绩表来演示Mysql中的各种连接查找 学生表的建表语句如下 CREATE TABLE student id int 11 NOT NULL AUTO INCREMENT COMMENT 自增序号 st id int
  • 深度学习的名词解释

    深度学习入门必须理解这25个概念 神经网络基础 1 神经元 Neuron 就像形成我们大脑基本元素的神经元一样 神经元形成神经网络的基本结构 想象一下 当我们得到新信息时我们该怎么做 当我们获取信息时 我们一般会处理它 然后生成一个输出 类
  • 【C语言程序设计实验】试卷管理系统(完整代码+函数详解) -->源代码文件文章末尾免费领取

    目录 实验简介 一 实验要求 二 实验代码 1 完整代码 2 代码解析 1 get next question number 2 add question 3 delete question 4 backup questions 5 del
  • js实现一个简易计算器

    正文 使用js实现一个简易计算器 可以进行简单的加减乘除 js代码 function jishuan 1 获取num1 num2 var num1 document getElementById num1 value var num2 do
  • TCP协议三次握手和四次分手以及数据传输过程

    1 三次握手 TCP是面向连接的 在面向连接的环境中 开始传输数据之前 在两个终端之间必须先建立一个连接 建立连接同步的过错称为三次握手 具体过程如下 1 当主机A想同主机B建立连接 主机A会发送SYN给主机B 初始化序列号seq x 主机
  • 深入了解数据导入的一些解决方案

    项目中除了有数据导出之外 也存在批量数据导入的场景 比如通过Execl电子表格进行批量开卡 批量导入用户或者部门信息等 今天探讨一下常见的数据导入方案 0x01 同步导入 如果批量导入的数据就是几十条到一两百条的数据量的话 而且每条数据导入
  • angular:使用Router.navigateByUrl传递state后如何在新组建获取state传递的data

    问题 如题 解决办法 使用history state来获取
  • 网络分析器Wireshark过滤器设置

    1 简介 Wireshark是目前全球使用最广泛的开源抓包软件 可以对网络进行故障定位 对网络黑客攻击进行快速定位 分析底层通信机制等 2 Wireshark安装 下载地址 Wireshark Go Deep https www wires
  • Mybatis快速学习笔记(建议收藏)

    Mybatis快速学习目录 Mybatis概念 MyBatis 快速入门 Mapper代理开发 MyBatis核心配置文件 配置文件的各种细节 Mybatis三部曲 如何解决字段名和属性名不一致问题 Mybatis如何接收来自数据库参数 多
  • 引用window自定义变量以及ts在window上自定义变量数据类型报错的解决方案

    一 问题描述 举个例子 在TypeScript中 当我们需要给window对象添加全局变量 如testName 或者需要使用window下自定义创建的变量 以testName为例 会出现以下ts报错 类型 Window typeof glo