打字稿：类型'null'不可分配给类型错误

Posted 2023-03-13

【中文标题】打字稿：类型\'null\'不可分配给类型错误

【英文标题】：Typescript: Type 'null' is not assignable to type error打字稿：类型'null'不可分配给类型错误

【发布时间】：2018-02-02 02:24:20

【问题描述】：

将以下代码转换为打字稿时出现错误。

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

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

当我分配所需的值时，如下所示

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

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

错误 TS2322：类型“元素 | null' 不能分配给类型 ' style: any; '。 类型 'null' 不能分配给类型 ' style: any; '。

【问题讨论】：

尝试使用 var or let 代替 const

querySelector in Typescript的可能重复

【参考方案1】：

document.querySelector 返回Element 的实例。在它的打字中没有太多declared。为了修复错误 - 将其转换为更具体的类型，例如：

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

    element.style.display = '';

基本上从HTMLElement 继承的所有东西都可以完成这项工作。

【参考方案2】：

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

例如：在您的情况下，querySelector 返回 'Element|null' 类型的值 所以，你可以像这样定义你的元素变量

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

希望这会有所帮助。