Warum kann ich in React Router nicht als Komponente in verwenden? ⇐ JavaScript

[Guest]

Ich erstelle derzeit einen Routes -Ordner, um mein Projekt besser zu organisieren, wenn es wächst. In meinem App.jsx kann ich es nicht als Komponente verwenden. Stattdessen muss ich es als Funktion nennen {Gameroutes ()} . PrettyPrint-Override ">

Code: Select all

"react": "^18.3.1",
"react-router-dom": "^7.1.4",
< /code>
Meine Fragen: < /p>

 Warum kann ich  < /code> in  nicht verwenden 

Wie eine normale React -Komponente? ul>
Src/app.jsx

Code: Select all

// Import routes
import GameRoutes from '@/routes/GameRoutes';



{/* PUBLIC */}



{GameRoutes()} {/* Works, but why not  ? */}

Src/routes/gameroutes.jsx

Code: Select all

import { Route } from 'react-router-dom';
import Games from '@/games/_Games/Games';
import TicTacToe from '@/games/TicTacToe/TicTacToe';
import TicReact from '@/games/TicTacToe/TicReact/TicReact';
import TicMe from '@/games/TicTacToe/TicMe/TicMe';

const GameRoutes = () => {
return (






);
};

export default GameRoutes;