Zum Hauptinhalt springen

Neue Seite erstellen

Neue Seite erstellen​

  1. Erstellen Sie einen neuen Ordner unter src/pages. Geben Sie dem Ordner für die folgenden Lernmissionen den Namen NewPage.

    Linker Navigationsbereich mit hervorgehobenem NewPage-Ordner

  2. Erstellen Sie im Ordner NewPage eine Datei mit dem Namen NewPage.tsx und fügen Sie die folgenden Codezeilen ein:

    NewPage.tsx
    import React from 'react';

    export const MyNewPage: React.FC = () => <h2>{'Under construction'}</h2>;
  3. Öffnen Sie die Datei App.config.tsx und importieren Sie die neue Seite. Fügen Sie zunächst die folgende Zeile an die Importanweisungen an:

    App.config.tsx
    ...
    import { MyNewPage } from '../pages/NewPage/NewPage';
    ...
  4. Fügen Sie sie dann als Teil von routes ein:

    App.config.tsx
    ...
    routes: [
    ...
    {
    title: "New Page",
    path: '/NewPage',
    component: MyNewPage,
    },
    ...
    ],
    ...

    App.config.tsx Importanweisungen

  5. Speichern Sie Ihre Änderungen und führen Sie npm start aus. Ihre neue Seite sollte wie folgt aussehen:

    Seite „Location“ im Browser

On this page