react-router-dom 相关问题

使用此标记可以了解有关DOM使用和React Router v4绑定的问题。

Vercel 的专用路由问题

我需要你的帮助。我的 React 应用程序中有一个 React Router Dom(6.10.0)。它在我的本地主机上运行良好,但是当我将其部署在 Vercel 上时,我无法访问私有路由,而非私有页面(Welco...

回答 1 投票 0

使用 React Router DOM 表单组件将“/?index”附加到地址栏中的基本 URL

我正在使用react和react-router-dom实现一个身份验证页面,其中我的登录页面是我主页的索引路由,我正在利用react-router-dom表单组件来处理提交...

回答 1 投票 0

react-router routerprovider 中未受保护和受保护的路由

我之前用这种方式使用反应路由器的旧方式构建了一个应用程序 应用程序.jsx 如果(验证){ 返回 } 返回 应用程序保护的路线 <...

回答 1 投票 0

表单提交中的 React Router 导航

导航不起作用,当我手动输入 URL 和链接时,React 路由器工作正常 常量导航 = useNavigate(); 函数handleForm() { console.log(&quo...

回答 1 投票 0

如何使用 React Router v6 创建子路由器?

这是我当前的 React Router 实现: const 路由器 = createBrowserRouter([ { 小路: ”/”, 元素: ( <...

回答 2 投票 0

浏览器路由器构建不将index.html作为npm run build中的react-router-dom的主页

我在运行 npm run build 时遇到了 React Router DOM 的问题。当尝试将主页设置为构建文件夹中的index.html 时,就会出现问题。尽管尝试了各种解决方案...

回答 1 投票 0

React-Router 6.23.0 - 如何在导航到 url 后隐藏子路径

我使用react-router 6.23.0的路线有以下代码 const 路由器 = createBrowserRouter([ { 路径:'/水果', 元素: , 错误元素:<

回答 1 投票 0

react router dom loader 延迟类型问题

我尝试通过在loader函数中使用defer来解决加载数据时的问题。 我不知道如何设置postResponse类型,这是实际的响应数据。 即使我尝试类型转换或

回答 1 投票 0

无法在react“dispatcher is null”中实现路由

这是我的App.js 从“./logo.svg”导入徽标; 导入'./App.css'; 从 './componentes/Header' 导入标头; 从 './componentes/FormularioLogin' 导入 FormularioLogin; 导入 { 创建浏览器...

回答 1 投票 0

子组件未使用 Outlet 渲染

我在显示子组件时遇到问题。 这是我在 App.js 中使用的代码 }> ...

回答 1 投票 0

React Js 和 Next Js 之间有什么关系

Next.js 与 React.js 相比如何简化路由和数据获取的过程 使用react-router-dom在react中创建路由。虽然仅仅在 Next js 中为路由创建文件夹就已经很麻烦了

回答 1 投票 0

如何在同一页面使用layout和provider?

我有一个提供程序,它向服务器发出请求以刷新令牌并具有一些值。我还有一个带有侧边栏的简单布局。我只想在一条路线中使用它们。我不知道在哪里添加layo...

回答 1 投票 0

如何在React JS中创建受保护的路由?

我已经在 React JS 中创建了页面导航的路由,现在我想保护其中一些路由,就像我希望其中一些仅在用户登录时才能访问。 const [isLoggedIn, setIsLoggedIn] =

回答 1 投票 0

使用 RouterProvider 会导致错误消息:警告:无效的挂钩调用,未捕获的类型错误:无法读取 null 的属性(读取“useState”)

我正在密切关注在线教程,但由于以下错误而陷入了非常早期的阶段: react-router-dom.js?v=b0141f25:137 警告:无效的钩子调用。挂钩只能...

回答 1 投票 0

如何监视和测试react-router-dom包的“useNavigate”方法是否被调用

我试图在react-router-dom包的“useNavigate”方法上添加间谍,以测试它是否在导航上被调用。但我收到此错误“TypeError:无法重新定义...

回答 1 投票 0

索引和路径的区别=“”

我现在正在学习React Router。我有以下一组路线: } /> <

回答 2 投票 0

接口 DOMRouterOpts 未导出

尝试在React项目中将react-router-dom:6.22.3与TypeScript一起使用时遇到导入类型问题 从“react-router-dom ...

回答 1 投票 0

如何在react-router-dom 6中分叉路由?

我有一条路线: )} /> 用户是一个布局组件,我根据参数决定要渲染的内容。 我有 2 个选择...

回答 1 投票 0

如何在react+react router dom中使用createBrowserRouter?

在我的应用程序中,我使用 BrowserRouter 组件来渲染我的路由或组件。但我想使用加载程序功能。但我目前的方法无法使用该功能。 <

回答 1 投票 0

为什么react js中没有调用loader函数?

我正在使用react router dom loader功能 https://reactrouter.com/en/main/route/loader 我正在使用react router dom loader功能 https://reactrouter.com/en/main/route/loader <BrowserRouter> <Routes> <Route path={'/ap'} loader={() => { console.log('0000'); return 'ss'; }} element={<App />} ></Route> </Routes> </BrowserRouter> 当我检查控制台时,它没有被调用,或者换句话说,消息没有被打印。 这是我的代码 https://stackblitz.com/edit/vitejs-vite-6gg4ab?file=src%2FApp.tsx,src%2Fmain.tsx&terminal=dev function App() { const [count, setCount] = useState(0); const data = useLoaderData(); console.log('----s', data); return ( <> <div> <a href="https://vitejs.dev" target="_blank"> <img src={viteLogo} className="logo" alt="Vite logo" /> </a> <a href="https://react.dev" target="_blank"> <img src={reactLogo} className="logo react" alt="React logo" /> </a> </div> <h1>Vite + React</h1> </> ); } 我正在尝试在路由之前获取一些数据..不知道我在哪里。我做错了 路由加载器仅在使用数据路由器时起作用,例如使用 createBrowserRouter、createMemoryRouter 等创建的路由器。如果您想使用数据 API,那么您需要转换为数据路由器。 示例: import { createBrowserRouter, createRoutesFromElements, RouterProvider, Route, } from 'react-router-dom'; const router = createBrowserRouter( createRoutesFromElements( <Route path="/ap" loader={() => { console.log('0000'); return 'ss'; }} element={<App />} /> ) ); ... <RouterProvider router={router} /> 欲了解更多信息,请参阅: 选择路由器 路线loader

回答 1 投票 0

© www.soinside.com 2019 - 2024. All rights reserved.