javascript - Typfel: Objektet kan vara 'null'. TS2531 för window.document

Jag lägger till TypeScript i mitt projekt för första gången.

Att använda window.document.getElementById() för att få åtkomst till något resulterar i felet:

Type error: Object is possibly 'null'.  TS2531

Jag sökte online men kunde inte hitta den bästa lösningen för detta. window kan aldrig vara null.

Svar #1

TS gör sitt jobb och berättar för dig att window.document.getElementById("foobar") KAN returnera något som är null.

Om du är helt säker på att #foobar-elementet FINNS i ditt DOM, kan du visa TS ditt självförtroende med en !-operator.

// Notice the "!" at the end of line
const myAbsolutelyNotNullElement = window.document.getElementById("foobar")!

Eller, du kan lägga till en körningstid nullable-kontroll för att göra TS nöjd

const myMaybeNullElement = window.document.getElementById("foobar")

myMaybeNullElement.nodeName // <- error!

if (myMaybeNullElement === null) {
  alert('oops');
} else {
  // since you've done the nullable check
  // TS won't complain from this point on
  myMaybeNullElement.nodeName // <- no error
}

Svar #2

window.document.getElementById("foobar");

Returnerar antingen ett HTMLElement eller null

Som du kanske har använt ett liknande uttalande tidigare: window.document.getElementById("foobar").value

Typescript klagar på att värdet kanske inte är tillgängligt och du bör uttryckligen kontrollera detta innan.

För att undvika detta kan du göra följande:

const element = window.document.getElementById("foobar");

if (element !== null) {
    alert(element.value);
}

Relaterade artiklar