Dateinamenskonventionen

Das dateibasierte Routing erfordert, dass Sie einige einfache Dateinamenskonventionen befolgen, um sicherzustellen, dass Ihre Routen korrekt generiert werden. Die Konzepte, die diese Konventionen ermöglichen, werden im Leitfaden Route Trees & Nesting detailliert behandelt.

Funktion	Beschreibung
__root.tsx	Die Root-Routen-Datei muss __root.tsx heißen und muss im Stammverzeichnis des konfigurierten routesDirectory platziert werden.
. Trennzeichen	Routen können das Zeichen . verwenden, um eine verschachtelte Route zu bezeichnen. Zum Beispiel wird blog.post als Kind von blog generiert.
$ Token	Routensegmente mit dem Token $ sind parametrisiert und extrahieren den Wert aus dem URL-Pfadnamen als Routen-param.
_ Präfix	Routensegmente mit dem Präfix _ werden als pfadlose Layout-Routen betrachtet und nicht verwendet, wenn ihre Kind-Routen mit dem URL-Pfadnamen abgeglichen werden.
_ Suffix	Routensegmente mit dem Suffix _ schließen die Route von der Verschachtelung unter übergeordneten Routen aus.
- Präfix	Dateien und Ordner mit dem Präfix - werden vom Routenbaum ausgeschlossen. Sie werden nicht in die Datei routeTree.gen.ts aufgenommen und können zur Lokalisierung von Logik in Routenordnern verwendet werden.
(folder) Ordnernamensmuster	Ein Ordner, der diesem Muster entspricht, wird als Routengruppe behandelt, wodurch verhindert wird, dass der Ordner in den URL-Pfad der Route aufgenommen wird.
[x] Maskierung	Eckige Klammern maskieren Sonderzeichen in Dateinamen, die sonst eine Routing-Bedeutung hätten. Zum Beispiel wird script[.]js.tsx zu /script.js und api[.]v1.tsx wird zu /api.v1.
index Token	Routensegmente, die mit dem Token index enden (vor jeglichen Dateierweiterungen), stimmen mit der übergeordneten Route überein, wenn der URL-Pfadname exakt mit der übergeordneten Route übereinstimmt. Dies kann über die Konfigurationsoption indexToken konfiguriert werden, siehe optionen.
.route.tsx Dateityp	Bei der Verwendung von Verzeichnissen zur Organisation von Routen kann das Suffix route verwendet werden, um eine Routendatei am Pfad des Verzeichnisses zu erstellen. Zum Beispiel können blog.post.route.tsx oder blog/post/route.tsx als Routendatei für die Route /blog/post verwendet werden. Dies kann über die Konfigurationsoption routeToken konfiguriert werden, siehe optionen.

💡 Denken Sie daran: Die Dateinamenskonventionen für Ihr Projekt können davon beeinflusst werden, welche optionen konfiguriert sind.

Dynamische Pfadparameter

Dynamische Pfadparameter können sowohl in flachen als auch in Verzeichnisrouten verwendet werden, um Routen zu erstellen, die mit einem dynamischen Segment des URL-Pfads übereinstimmen können. Dynamische Pfadparameter werden durch das Zeichen $ im Dateinamen gekennzeichnet.

Dateiname	Routenpfad	Komponentenausgabe
...	...	...
ʦ posts.$postId.tsx	/posts/$postId	<Root><Posts><Post>

Wir lernen mehr über dynamische Pfadparameter im Leitfaden Path Params.

Pfadlose Routen

Pfadlose Routen umschließen Kind-Routen mit entweder Logik oder einer Komponente, ohne einen URL-Pfad zu benötigen. Nicht-Pfad-Routen werden durch das Zeichen _ im Dateinamen gekennzeichnet.

Dateiname	Routenpfad	Komponentenausgabe
ʦ _app.tsx
ʦ _app.a.tsx	/a	<Root><App><A>
ʦ _app.b.tsx	/b	<Root><App><B>

Um mehr über pfadlose Routen zu erfahren, siehe den Leitfaden Routing Concepts - Pathless Routes.

Dynamische Pfadparameter

Pfadlose Routen

Bytes abonnieren

Bytes abonnieren