react + ts,路由组件 react-router-dom V6.2.1

//<Route> 必须用<routes>包裹一下,否则会报错,且<Link> 不可放在<Routes>标签以内。
//element={<Home />} 必须作为一个组件形式引入进来

```javascript
import React from 'react'
import ReactDOM from 'react-dom'
import './index.css'
import { BrowserRouter as Router,Routes,Route,Link } from 'react-router-dom'
//import App from './App'
import FirstPage from './components/First'


const First =()=> <p>页面一的内容</p>
const Home =()=> <p>主页</p>
const App =()=>(
  <Router>
    <h1>react-router</h1>
    <nav>
      <Link to="/">主页</Link>
      <Link to="/first">页面一</Link>
    </nav>
    <Routes>
      <Route path="/" element={<Home />}></Route>
      <Route path="/first" element={<First />} />
    </Routes>
  </Router>
)

ReactDOM.render(<App />,document.getElementById('root'))

记录一下!


评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值