我有一些包含這個的代碼：
var element = document.getElementById("div0");
element.parentNode.removeChild(element); // Error points here
我不斷得到：
object is possibly 'null'并嘗試添加！到元素，但它仍然抱怨。
我怎樣才能擺脫這個錯誤？
uj5u.com熱心網友回復：
正如@Sh 已經提到的那樣。Pavel 這是一個打字稿錯誤。
從我的角度來看，您有幾個選擇，但我只是指出兩個選擇，我認為這對您的問題是最好的。
選項 1：可選鏈接
通過使用可選鏈接，代碼在遇到 anull或 時會停止執行undefined。此外，與為每個可能為空的屬性添加保護相比，它生成的代碼更簡潔、更少。
const element = document.getElementById("div0");
element?.parentNode?.removeChild(element);
選項 2：守衛
通過使用守衛，只有在條件為真時才能到達代碼部分，因此 Typescript 了解這些值是在那時定義的
const element = document.getElementById("div0");
if (element && element.parentNode) {
element.parentNode.removeChild(element);
}
uj5u.com熱心網友回復：
這是 typescript 拋出的錯誤，因為回傳型別document.getElementById是HTMLElement | null. 您可以通過strictNullChecks: false在 tsconfig 中設定來禁用此檢查，但這是一個有用的檢查，因為如果 DOM 中不存在該元素，則呼叫實際上可能回傳 null。您還有其他選項可以在不禁用檢查的情況下處理此問題。
您可以檢查null并處理此案：
const element = document.getElementById('div0');
if (element === null) {
// you should handle the case in an appropriate way here
throw new Error('Element "div0" does not exist.');
}
// after the check above, the error will not be thrown anymore
element.parentNode.removeChild(element);
您可以使用!運算子告訴打字稿它應該假定該值永遠不會為空：
const element = document.getElementById('div0')!;
element.parentNode.removeChild(element);
需要注意的是，如果這種做法將導致運行時錯誤element是null運行時。
或者您可以使用?to 僅removeChild在元素不是時呼叫null：
const element = document.getElementById('div0');
element?.parentNode.removeChild(element);
這只會parentNode在element元素不為空時訪問。否則，運算式將計算為null并且removeChild不會被呼叫。
轉載請註明出處，本文鏈接：https://www.uj5u.com/net/409235.html
標籤：