import 'https://www.cnblogs.com/zsbb/p/App.css' import { BrowserRouter as Router, NavLink, Route, Routes } from 'react-router-dom' import February from 'https://www.cnblogs.com/zsbb/p/component/february' import March from 'https://www.cnblogs.com/zsbb/p/component/march' import Times from 'https://www.cnblogs.com/zsbb/p/component/february/index2' import Btn from 'https://www.cnblogs.com/zsbb/p/component/february/index' import Input from 'https://www.cnblogs.com/zsbb/p/component/february/index3' import Paging from 'https://www.cnblogs.com/zsbb/p/component/february/index4' import Model from 'https://www.cnblogs.com/zsbb/p/component/march/march1' import Change from 'https://www.cnblogs.com/zsbb/p/component/march/march2' import { Sloting } from 'https://www.cnblogs.com/zsbb/p/component/march/march3' import { Stateful } from 'https://www.cnblogs.com/zsbb/p/component/march/march4' import { StatefulWork } from 'https://www.cnblogs.com/zsbb/p/component/march/march5' import WordSix from 'https://www.cnblogs.com/zsbb/p/component/march/march6' import Product from 'https://www.cnblogs.com/zsbb/p/component/march/march7' import Button from 'https://www.cnblogs.com/zsbb/p/component/march/march8' import Effect from 'https://www.cnblogs.com/zsbb/p/component/march/march9' import Hooks from 'https://www.cnblogs.com/zsbb/p/component/march/march10' import Context from 'https://www.cnblogs.com/zsbb/p/component/march/march11' import VModel from 'https://www.cnblogs.com/zsbb/p/component/february/index5' import { Reducer } from 'https://www.cnblogs.com/zsbb/p/component/march/march12' import { Want } from 'https://www.cnblogs.com/zsbb/p/component/february/index6' function App() { return ( <Router> <NavLink className={({ isActive }) => isActive ? 'active' : ''} to="/february">2023-02-28</NavLink> <NavLink className={({ isActive }) => isActive ? 'active' : ''} to="/march">2023-03-01</NavLink> <Routes> <Route path='/' element=''></Route> <Route path='february' element={<February />}> {/* index 默认显示 */} {/* <Route index element={<Times />} /> */} <Route path='times' element={<Times />} /> <Route path='btn' element={<Btn />} /> <Route path='input' element={<Input />} /> <Route path='paging' element={<Paging />} /> <Route path='vmodel' element={<VModel />} /> <Route path='text' element={<Want />} /> </Route> <Route path='march' element={<March />}> <Route path='model' element={<Model />}></Route> <Route path='change' element={<Change />}></Route> <Route path='slot' element={<Sloting />}></Route> <Route path='stateful' element={<Stateful />}></Route> <Route path='statefulWork' element={<StatefulWork />}></Route> <Route path='work' element={<WordSix />}></Route> <Route path='product' element={<Product />}></Route> <Route path='btn' element={<Button />}></Route> <Route path='effect' element={<Effect />}></Route> <Route path='hooks' element={<Hooks />}></Route> <Route path='context' element={<Context />}></Route> <Route path='reducer' element={<Reducer />}></Route> </Route> {/* Navigate重定向 */} {/* to相当于push，有历史记录，可以后退 */} {/* replace没有历史记录 */} {/* <Route path='/march' element={<Navigate to='/home' />}></Route> */} </Routes> </Router> ) } export default App