在新建react项目中
使用react-router-dom 6.0.1版本难免会遇到以下报错
Error: A <Route> is only ever to be used as the child of <Routes> element, never rendered directly. Please wrap your <Route> in a <Routes>.
首先要了解 6.0.1的写法更改了
要切换的组件
function Index() {return <h2>首页</h2>;}function List() {return <h2>列表</h2>;}
以前版本
Route需要在Router里，组件为component
function Example() {return (<Router><ul><li> <Link to="/">首页</Link> </li><li><Link to="/list/">列表</Link> </li></ul><Route path="/" exact component={Index} /><Route path="/list/" component={List} /></Router>)}
现在版本
Route需要在Routes里，组件为element,注意括号内为标签
function Example() {return (<div><ul><li><Link to="/">首页</Link></li><li><Link to="/list/">list</Link></li></ul><Routes><Route path="/" exact element={<Index/>}/><Route path="/list/" element={<List/>}/></Routes></div>)}
官方案例地址: /github/remix-run/react-router/tree/main/examples/basic?file=src%2FApp.tsx.
官方git仓库: /remix-run/react-router.
关于react-router-dom 6.0.1的基础写法 解决Error: A ＜Route＞ is only ever to be used as the child of ＜Routes＞
