Vue中使用props时，ts报TS2532: Object is possibly ‘undefined‘的解决办法

最新推荐文章于 2024-08-06 10:00:04 发布

Selicens

最新推荐文章于 2024-08-06 10:00:04 发布

阅读量9.6k

点赞数 5

文章标签： vue.js typescript javascript

本文链接：https://blog.csdn.net/Web_ChuXia/article/details/126300566

版权

首先来还原下问题现场，用的是Vue3setup语法糖

<script setup lang="ts">
	const props = defineProps({
		data: Object
	})
	props.data.xx // 此时ts报错TS2532: Object is possibly 'undefined'
</script>

ts报错TS2532: Object is possibly ‘undefined’，提示对象可能未定义，但实际上data是有值得，并且页面也是正常展示，也就是说不影响正常使用，但是页面飘红强迫症也很不爽，解决办法：

	props.data!.xx

在变量后添加非空断言运算符，也就是感叹号！，有时typescript编译器无法确定它在某一点上可能具有什么类型的值，通过在变量后添加！，可以让编译器知道此变量不会未定义或成为null
查询的过程中发现一篇如何解决typescript中可能未定义的值的文章，作者列出了五种解决办法，可以参考下：https://linguinecode.com/post/how-to-solve-typescript-possibly-undefined-value