javascript - React-router-dom 重定向不起作用 - 显示错误
问题描述
我的反应应用程序 react-router-dom 不起作用。它显示错误
类型错误:path_to_regexp__WEBPACK_IMPORTED_MODULE_8___default.a.compile 不是函数
查看图片
我不确定为什么用 react-router-dom 显示错误问题
检查我的代码
该代码显示错误
import React from 'react'
import DefaultLayout from './Component/Layout/DefaultLayout';
import DefaultLogin from './Component/Login/DefaultLogin';
import DefaultSignup from './Component/Sign-up/DefaultSignup';
// react-router-dom
import { BrowserRouter as Router, Route, Switch, Redirect } from "react-router-dom";
// bootstrap css
import 'bootstrap/dist/css/bootstrap.min.css';
// css for global
import './App.scss';
export default function App() {
return (
<>
<Router>
<Switch>
<Route path="/admin" exact component={DefaultLayout} />
<Route path="/admin/signup" component={DefaultSignup} />
<Route path="/admin/login" component={DefaultLogin} />
<Redirect from="/" to="/admin" />
</Switch>
</Router>
</>
)
}
检查我的代码
该代码未显示错误,但其余应用程序无法正常工作,因为我使用Redirect,不在Switch组件中
export default function App() {
return (
<>
<Router>
<Switch>
<Route path="/admin" exact component={DefaultLayout} />
<Route path="/admin/signup" component={DefaultSignup} />
<Route path="/admin/login" component={DefaultLogin} />
</Switch>
{/* this show not error but rest app not work proper */}
<Redirect from="/" to="/admin" />
</Router>
</>
)
}
解决方案
发生此错误通常是因为 create-react-app 安装了您可以在 package.lock.json 中看到的 express 模块,并且它进一步安装了旧版本 0.1.7 的 path-to-regexp ,但为了使 react-router 工作它需要 1.7.0 或更高版本。因此,您可以在应用程序中安装 path-to-regexp 模块(npm i path-to-regexp)并重新启动应用程序。一切都会好起来的。
推荐阅读
- java - Java流,获取对象列表的映射
- python - 元素引发 TimeoutException
- javascript - 页面重新加载后来自 JS 的按钮单击仅有效不能始终如一地工作
- php - PHP AJAX HTML:在 foreach 循环中更改唯一表数据
- flutter - 如何从 SliverPersistentHeader 中删除海拔?
- python - 遍历整数列以查看该值是否包含在不同列的范围内
- javascript - 如何使用 keydown 事件移动列表项
- python - 尝试 pip numba JIT 编译器时出错
- c# - 重新连接后网络服务不工作
- google-apps-script - 谷歌表单获取谷歌表格值