打字稿：類型“ null”不可分配給類型錯誤

Question

將以下代碼轉換為打字稿時出現錯誤。

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; }'。

Answer 1

document.querySelector返回Element實例。 並且在類型中沒有太多聲明 。 為了解決錯誤-將其強制轉換為更具體的類型，例如：

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

基本上，所有繼承自HTMLElement的東西都可以完成。

Answer 2

我建議在聲明變量時給出特定的類型。

例如：在您的情況下，querySelector返回類型為'Element | null'的值。因此，您可以像這樣定義元素變量

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

希望這可以幫助。