ts报错|| Warning: Failed prop type:xxx but its value is `undefined`

场景

在这里插入图片描述

分析

可选链(?.)

可选链操作符允许你安全地访问对象的嵌套属性,即使其中间的一个属性可能不存在也不会抛出错误。如果globalAlertDetail是一个对象并且它有isShow属性,那么globalAlertDetail?.isShow会返回该属性的值。如果globalAlertDetail不存在或isShow属性不存在,表达式会返回undefined而不是抛出一个类型错误。

非空断言(!)

非空断言操作符用于告诉TypeScript编译器你确信某个表达式的值不是null或undefined。这通常用于强制类型检查忽略可能的null或undefined值。然而,在运行时,如果你对一个实际为undefined或null的值使用非空断言,那么可能会引发运行时错误,因为JavaScript引擎会尝试访问不存在的属性。

结合使用

当你写 globalAlertDetail?.isShow! 时,你是在告诉TypeScript(或其他支持此语法的环境):“尝试获取globalAlertDetail的isShow属性,但如果globalAlertDetail是undefined或null,不要抛出错误。然而,我保证如果globalAlertDetail存在,那么它一定有isShow属性。”

这意味着如果globalAlertDetail是undefined或null,globalAlertDetail?.isShow会返回undefined,但!会导致之后的代码试图使用isShow的值,这可能会引发运行时错误,例如Cannot read properties of undefined (reading ‘isShow’)。
或者标题类似错误
 value is

解决方案

1.使用这样的表达式需要确保globalAlertDetail确实存在并有isShow属性,否则你需要有处理undefined的逻辑,例如使用逻辑与操作符(&&):

const isShow = globalAlertDetail && globalAlertDetail.isShow;

2.使用可选链和逻辑或操作符(||)提供一个默认值:

const isShow = globalAlertDetail?.isShow || false;

在这里插入图片描述

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://xiahunao.cn/news/3248723.html

如若内容造成侵权/违法违规/事实不符,请联系瞎胡闹网进行投诉反馈,一经查实,立即删除!

相关文章

Python机器学习、深度学习技术提升气象、海洋、水文领域实践技术

Python是功能强大、免费、开源,实现面向对象的编程语言,能够在不同操作系统和平台使用,简洁的语法和解释性语言使其成为理想的脚本语言。除了标准库,还有丰富的第三方库,Python在数据处理、科学计算、数学建模、数据挖…

如何使用AI辅助开发

自从踏上AI辅助开发这条不归路,就回不了头,只能勇往直前!就算是简单的智能提示、补充代码、自动多语言补全等功能,就已经让你离不开它,更何况强大的代码生成成功。如果还没有开始使用AI辅助开发,那么赶快为…

C++复习的长文指南

C复习的长文指南 一、入门语法知识1.预备1.1 main函数1.2 注释1.3 变量1.3 常量1.4 关键字1.5 标识符明明规则 2. 数据类型2.1 整型2.1.1 sizeof关键字 2.2 实型(浮点型)2.3 字符型2.4 转义字符2.5 字符串型2.6 布尔类型bool2.7 数据的输入 3. 运算符3.1…

windows 11 PC查询连接过的wlan密码

1:管理员打开cmd 2:输入netsh wlan show profiles 3:netsh wlan show profiles Shw2024-5G keyclear 密码关键内容:12345678

函数返回右值的一点学习研究

https://zhuanlan.zhihu.com/p/511371573?utm_mediumsocial&utm_oi939219201949429760 下面情况下不会调用: DPoint3d fun1() {return DPoint3d{1,2,3}; // 默认构造 }int main() {DPoint3d&& a fun1();a.y 20;int i 0;i; } 下面情况下&#xff0c…

Stable Diffusion:质量高画风清新细节丰富的二次元大模型二次元插图

今天和大家分享一个基于Pony模型训练的二次元模型:二次元插图。关于该模型有4个不同的分支版本。 1.5版本:loar模型,推荐底模型niji-动漫二次元4.5。 xl版本:SDXL模型版本 mix版本:光影减弱,减少SDXL版本…

[职场] MARKETINGSPECIALIST是什么 #笔记#微信#知识分享

MARKETINGSPECIALIST是什么 MARKETINGSPECIALIST,即市场营销专员,他们需要具备一定的专业知识和技能,以适应快速变化的市场环境。接下来,我们将详细探讨这个职位的工作内容、必备技能以及发展前景。 一、MARKETINGSPECIALIST是什么…

Postfix搭建安装教程:解决配置难题攻略!

Postfix搭建安装教程的详解!如何优化邮件服务器性能? Postfix是一款广泛使用的电子邮件服务器软件,以其高效、可靠和安全性而闻名。许多企业和个人站点都选择Postfix来处理邮件传输任务。AokSend将提供一个详尽的Postfix搭建安装教程。 Pos…

我在高职教STM32——串口通信(1)

大家好,我是老耿,高职青椒一枚,一直从事单片机、嵌入式、物联网等课程的教学。对于高职的学生层次,同行应该都懂的,老师在课堂上教学几乎是没什么成就感的。正是如此,才有了借助头条平台寻求认同感和成就感…

水利行业的智慧转型之路:分析智慧水利的核心要素与优势,展望其在提升水资源利用效率、保障水安全方面的广阔前景

目录 引言 一、智慧水利的核心要素 1. 物联网技术 2. 大数据与云计算 3. 人工智能与机器学习 4. 移动互联网与GIS技术 5. 标准化与信息安全 二、智慧水利的优势 1. 提高水资源利用效率 2. 增强水灾害防御能力 3. 提升水环境治理水平 4. 促进水利服务智能化 三、展望…

5.6 软件工程-运维

运维 - 系统转换 运维 - 系统维护 运维 - 系统评价 真题

深入理解JVM内存管理:从区域划分到优化策略

JVM内存区域划分有哪些? 堆内存:分为新生代和老年代 新生代:临时对象,所有对象最开始都是年轻代,使用完会被回收或转入老年代 老年代:长期存在的对象 进入老年代的情况: 1.新生代垃圾回收超…

python ATM实现

代码要求: 详细代码: money 50000000 name input("输入您的姓名 :")#查询功能 def search(show_header):if show_header:print("--------查询余额--------")print(f"{name},您好,您的余额…

模板方法原理与C++实现

定义 定义一个操作中的算法骨架(稳定的),而将一些步骤的实现延迟到子类中(变化的)。模板方法使得子类可以复用一个算法的结构,而只改变(重写)这个算法的特定步骤。 C实现 class L…

为ppt中的文字配色

文字的颜色来源于ppt不可删去的图像的颜色 从各类搜索网站中搜索ppt如何配色,有如下几点: 1.可以使用对比色,表示强调。 2.可以使用近似色,使得和谐统一。 3.最好一张ppt中,使用的颜色不超过三种主要颜色。 但我想强调…

【细如狗】记录一次使用MySQL的Binlog进行数据回滚的完整流程

文章目录 1 事情起因2 解决思路3 利用binlog进行数据回滚3.1 确认是否启用Binlog日志3.2 确认是否有binlog文件3.3 找到误操作的时间范围3.4 登录MySQL服务器查找binlog文件3.4.1 查询binlog文件路径3.4.2 找到binlog文件3.4.3 确认误操作被存储在哪一份binlog文件中 3.5 查看二…

嵌入式人工智能(9-基于树莓派4B的DS1302实时时钟RTC)

1、实时时钟(Real Time Clock) RTC,全称为实时时钟(Real Time Clock),是一种能够提供实时时间信息的电子设备。RTC通常包括一个计时器和一个能够记录日期和时间的电池。它可以独立于主控芯片工作&#xff…

N Puzzle (数字推盘游戏)

N Puzzle [数字推盘游戏] 1. 15 Puzzle2. N PuzzleReferences puzzle /ˈpʌzl/:n. 谜,智力游戏,疑问,不解之谜,令人费解的事 vt. 迷惑,使困惑1. 15 Puzzle https://en.wikipedia.org/wiki/15_puzzle The…

【Python脚本】读取execl表格域名到期时间进行筛选通过webhook进行通知

【Python脚本】读取execl表格域名到期时间进行筛选通过webhook进行通知 execl表格示例: import pandas as pd import requestsdf = pd.read_excel(D:\xx\xx\SSL.xlsx, sheet_name=None)webhook_url = "https://open.feishu.cn/open-apis/bot/v2/XXX?"for sheet_na…

高校如何拥抱国产化OS?中南民族大学信息化应用实践

CentOS 已然停服,数量众多的使用 CentOS 的企业以及高校,都面临着系统替换的迫切需求。国产化操作系统候选者众多,如何在兼顾原有系统兼容性的基础上,在国产化操作系统进行整体环境的平稳迁移,成为在选择 CentOS 替换方…