Typescript:类型“null”不可分配给类型错误

Question

将以下代码转换为typescript时出错。

const element = document.querySelector('#launcher');
if (element && element.style && element.style.display) {
    element.style.display = '';
}

错误TS2339：属性样式在元素类型上不存在。

当我为如下相同的值分配所需值时

const element: { style: any } = document.querySelector('#launcher');

那么误差在元素上，那就是

错误TS2322:类型“Element | null”不可分配给类型“{style:any；}”。类型“null”不可分配给类型“{style:any；}”。

Answer 1

我建议在声明变量时提供特定类型。

例如：在您的例子中，querySelector返回'Element | null'类型的值，因此您可以像这样定义元素变量

const element: Element = document.querySelector('#launcher');

希望这有帮助。

Answer 2

document.query选择器返回元素的实例。在它的打字中没有太多声明。为了修复错误-将其转换为更特定的类型，例如：

const element = document.querySelector('#launcher') as HTMLInputElement;
if (element && element.style && element.style.display)
{
    element.style.display = '';
}

基本上，从HtmleElement继承的所有内容都可以完成这项工作。