如何抑制“错误TS2533:对象可能是'空'或'未定义'”?

我有一个类型:

type tSelectProtected = {
  handleSelector?: string,
  data?: tSelectDataItem[],

  wrapperEle?: HTMLElement,
  inputEle?: HTMLElement,
  listEle?: HTMLElement,
  resultEle?: HTMLElement,

  maxVisibleListItems?: number
}

我声明了一个全局模块变量:

var $protected : tSelectProtected = {};

我在function1()范围内分配适当的值:

$protected.listEle = document.createElement('DIV');

稍后在function2()作用域中，我调用:

$protected.listEle.classList.add('visible');

我得到TypeScript错误:

error TS2533: Object is possibly 'null' or 'undefined'

我知道我可以使用if ($protected. listele) {$protected. listele进行显式检查。listEle}使编译器平静下来，但这似乎对于大多数非平凡的情况非常不方便。

在不禁用TS编译器检查的情况下如何处理这种情况?

当前回答

很惊讶没有人回答这个问题，你所要做的就是在访问它之前检查对象是否存在，这很直接。否则，请确保在访问对象之前初始化了您的值。

if($protected.listEle.classList) {
   $protected.listEle.classList.add('visible');
}

2021-06-29 03:09:56

其他回答

在typescript中，关闭可能为null的消息:

Interface   {
  data: string|null
}

const myData = document.data ?? "";

2021-03-24 08:12:18

如果你知道该类型永远不会为null或未定义，你应该声明为foo: Bar，不带?类型声明?条形语法意味着它可能是未定义的，这是您需要检查的。

换句话说，编译器正在做你要求它做的事情。如果您希望它是可选的，您稍后需要检查。

2016-10-31 20:24:52

我在使用Angular (11.x)时遇到了这个问题。在前一天，我移动了一段HTML/组件到一个单独的-较小的-组件。第二天，我的电脑关机了，我的项目无法构建。结果是.html组件出了问题。如前所述，这是零安全。

以下(节选):

<div class="code mat-body-strong">{{machine. "productCode}} < / div >

<div class="code mat-body-strong">{{machine?。productCode}} < / div >

2021-03-16 07:21:39

从TypeScript 3.7 (https://www.typescriptlang.org/docs/handbook/release-notes/typescript-3-7.html)开始，你现在可以使用?。当访问null或未定义对象上的属性(或调用方法)时获得未定义的操作符:

inputEl?.current?.focus(); // skips the call when inputEl or inputEl.current is null or undefined

2019-12-09 20:48:26

// @ts-nocheck

将此添加到文件的顶部

2021-06-18 13:54:14

如何抑制“错误TS2533:对象可能是'空'或'未定义'”?

推荐文章

最新文章

标签