Funktioniert das noch mit React 19?

Nicht über React. React 19 ignoriert die `propTypes` einer Komponente vollständig: die Prüfung wurde entfernt, nicht als veraltet markiert. Das Paket `prop-types` arbeitet weiter als eigenständiger Validator, den Sie selbst aufrufen, und diese Formen sind weiterhin gültiges JavaScript; wollen Sie unter React 19 Props prüfen, lautet die Antwort TypeScript.

Warum ist alles `.isRequired`?

Weil jeder Schlüssel in der Probe stand. Das ist eine Aussage über eine Nutzlast, und `.isRequired` ist ihre ehrliche Übersetzung: eine Prop, die da war. Ob sie immer da ist, steht nicht im Dokument; streichen Sie `.isRequired` bei denen, ohne die Ihre Komponente auskommt.

Stecken diese Prüfungen in meinem Produktionsbündel?

Die Warnungen nicht: React führte PropTypes-Prüfungen nur in der Entwicklung aus, und die Bibliothek hält es genauso. Die Form-Objekte selbst werden mitgeliefert, sofern Ihr Bundler sie nicht entfernt — ein Grund mehr, ein `PropTypes.shape` für eine große Nutzlast klein zu halten.

JSON in PropTypes — falsche Props melden sich

Ein JSON-Beispiel in PropTypes-Shapes verwandeln. Eine Shape je Objekt, standardmäßig required — eine Prop falscher Form erscheint in der Dev-Konsole.

Was dieses Werkzeug tut

Aus einer JSON-Probe werden PropTypes-Formen, ein const je Objekt.

{ "id": 1, "name": "Ada", "address": { "city": "Paris" } }

import PropTypes from 'prop-types';

export const AddressShape = PropTypes.shape({
  city: PropTypes.string.isRequired,
});

export const RootShape = PropTypes.shape({
  id: PropTypes.number.isRequired,
  name: PropTypes.string.isRequired,
  address: AddressShape.isRequired,
});

Kinder zuerst: es sind Laufzeitwerte, eine Form muss existieren, bevor eine andere auf sie verweist. Ein Array an der Wurzel bekommt sein eigenes const, PropTypes.arrayOf(UsersItemShape).

Pflicht heißt „es war da“

Jeder Schlüssel der Probe kommt als .isRequired heraus, weil die Probe ihn enthielt. Das ist eine prüfbare Aussage und, wo sie falsch ist, mit einer Löschung erledigt. Die Alternative — alles optional zu markieren — wäre eine Aussage über Daten, die niemand gezeigt hat, und machte die Prüfung genau dort nutzlos, wo sie zählt.

Zwei Fälle bleiben weich: ein null und ein unbekannter Wert ergeben beide PropTypes.any ohne .isRequired. Ein null sagt Ihnen, dass der Schlüssel existiert, und nichts über seinen Typ: ihn zu verlangen behauptete mehr, als die Probe trägt.

Nur in der Entwicklung, und das bewusst

PropTypes-Warnungen erscheinen in der Entwicklung und entfallen in der Produktion, von Haus aus. Das ist kein Fehler, das ist der Handel: eine Laufzeitprüfung, die dort nichts kostet, wo sie am teuersten wäre. Es heißt auch: eine fehlerhafte Nutzlast, die einen Nutzer erreicht, erzeugt gar keine Warnung — PropTypes ist eine Entwicklungshilfe, keine Validierungsschicht. Für Validierung, die überall läuft, gibt der Zod-Generator dieser Seite Schemas aus, die das tun.

React 19 liest sie nicht mehr

React 19 hat die propTypes-Prüfung an Komponenten entfernt: Component.propTypes zuzuweisen hat schlicht keine Wirkung mehr, stillschweigend. Das Paket prop-types gibt es weiter, und diese Formen bleiben Werte, die Sie selbst aufrufen können — PropTypes.checkPropTypes(…) —, doch wer heute auf einem aktuellen React beginnt, für den ist dieser Generator eher für bestehende Codebasen da als für neue.

Die üblichen Grenzen einer Probe

Ein gemischtes Array wird PropTypes.oneOfType([...]), genau so weit wie das Gesehene. Ein leeres Array wird PropTypes.array, ohne Aussage über die Elemente. Und ein Schlüssel, der kein gültiger Bezeichner ist, behält seine Anführungszeichen — was JavaScript anstandslos hinnimmt.

Datenschutz ab Werk

Alles läuft lokal in deinem Browser mit JavaScript. Deine Daten werden nie hochgeladen, wodurch das Tool auch für sensible Inhalte sicher ist und offline funktioniert.

JSON in PropTypes — falsche Props melden sich

JSON-Eingabe

PropTypes-Ausgabe