実現したいこと
react初心者です.
webページ作成の際にreactを用いており,簡単なページ作成後にページ遷移を可能にするため調べながらいろいろ試しましたが,うまくいきません.
前提
具体的には,App.jsのアロー関数App内に記述したreturnでしかページに表示する要素を扱えず,
その他のURLの要素(Routes内に記述した要素)が一切反映されない,といった形になります.
発生している問題・エラーメッセージ
ログにエラーは出ていませんが,そもそも実行すらされていないように思います.
該当のソースコード
Javascript
1import React, { Component } from "react"; 2import { BrowserRouter, Link, Route, Routes } from "react-router-dom"; 3import "./App.css"; 4 5const App = () => { 6 <BrowserRouter> 7 <Routes> 8 <div class="container text-center mt-5"> 9 <Route path={`/`} element={<Home />} /> 10 <Route path={`/about/`} element={<About />} /> 11 </div> 12 </Routes> 13 </BrowserRouter> 14} 15 16const Home = () => { 17 return ( 18 <div> 19 <h1>Welcome</h1> 20 </div> 21 ) 22} 23 24const About = () => { 25 return( 26 <div> 27 <h1>about</h1> 28 </div> 29 ) 30} 31 32export default App; 33
補足情報(FW/ツールのバージョンなど)
react-router-domのバージョンは6です.
その他,必要な情報とありましたら,コメントにて質問していただけると幸いです
回答1件
あなたの回答
tips
プレビュー
下記のような回答は推奨されていません。
このような回答には修正を依頼しましょう。
また依頼した内容が修正された場合は、修正依頼を取り消すようにしましょう。
2023/03/04 13:17
2023/03/04 13:59
2023/03/04 15:38