React Router Dom不呈现任何组件
React Router Dom是一个用于React应用程序的路由库。它提供了一种在应用程序中实现页面导航和路由的方式。React Router Dom基于React Router构建，是React社区中最受欢迎的路由解决方案之一。
React Router Dom的主要特点包括：
- 声明式路由：React Router Dom允许您使用声明式语法定义应用程序的路由。您可以使用特定的组件来映射URL路径到相应的组件。
- 嵌套路由：React Router Dom支持嵌套路由，这意味着您可以在一个组件中定义另一个组件的路由。这使得应用程序的路由结构更加灵活和可扩展。
- 动态路由：React Router Dom允许您定义动态路由，即根据URL中的参数或查询字符串来加载不同的组件。这使得您可以根据不同的数据或用户输入来呈现不同的内容。
- 导航组件：React Router Dom提供了一组导航组件，例如Link和NavLink，用于在应用程序中创建链接和导航菜单。这些组件可以方便地与路由一起使用，使用户能够轻松地导航到不同的页面。
React Router Dom适用于各种类型的React应用程序，包括单页面应用程序（SPA）和多页面应用程序（MPA）。它可以帮助您构建具有良好用户体验的导航和路由功能。
腾讯云提供了一系列与React Router Dom相关的产品和服务，例如：
- 腾讯云服务器（CVM）：腾讯云服务器是一种可扩展的云计算服务，可用于托管React应用程序和部署React Router Dom。
- 腾讯云对象存储（COS）：腾讯云对象存储是一种高可用、高可靠的云存储服务，可用于存储React应用程序的静态资源，如HTML、CSS和JavaScript文件。
- 腾讯云CDN：腾讯云CDN是一种全球分布式的内容分发网络，可加速React应用程序的静态资源的传输和加载速度。
您可以通过访问腾讯云官方网站（https://cloud.tencent.com/）了解更多关于这些产品的详细信息和使用指南。
相关·内容
2回答
如何将laravel和Vue2路由器混合在一起
vuejs2、laravel-5.4、vue-router
所以在我的laravel应用程序中，我们有一个网址
http://mywebsite.in/wfengine/search/
现在我想使用laravel路由器在上面的链接上工作，但似乎什么都没有发生。
Router.js
import VueRouter from 'vue-router';
let routes = [
{
path:'/filters',
componenet: require('./views/filter')
}
];
export default new VueRou
浏览 4提问于2017-06-12得票数 1
1回答
在交换路由路由时间，它正在工作，但现在最新的新路由，路由它不能运行自定义路由
javascript、reactjs、react-router、react-router-dom
在切换路由路由时间，它正在工作，但现在是最新的新路由，路由它不能工作的自定义路由--我已经在HomeLayoutHOC中包装了导航栏页面和主页--任何人都可以帮助我:)如何完成我尝试过的这个最新版本，但是有很多事情要做。没有结果
我想要'HomeLayoutHOC‘路线而不是’路由‘
->client\src\App.JSX :
//HOC
import HomeLayoutHOC from "./HOC/Home.Hoc";
import { Route, Routes } from "react-router-dom";
//Comp
浏览 1提问于2022-08-26得票数 1
回答已采纳
6回答
试图导入错误：“路由”不是从“react路由器-dom”导出的。
javascript、reactjs、npm
我正在尝试使用React路由器和路由，但是不断地得到这个错误：
我尝试了以下几点：
删除和重新安装react-router.deleting --路由器-dom和node_modules文件夹，并运行npm安装以确保react路由器和react-dom是相同的版本是的，我在上面列出的每一次尝试之后都重新启动了服务器。
以下是我的index.js代码：
import React from "react";
import ReactDOM from "react-dom";
import "./index.css";
import App fr
浏览 6提问于2021-06-08得票数 8
回答已采纳
4回答
React路由器v6 -无插座的嵌套路由
reactjs、react-router、router-outlet、react-router-v6
我正在使用react-router v6，可以不使用Outlet组件而使用嵌套路由吗？
例如:我有一个用户页面和一个用户组件上的onClick，它应该导航到特定的用户页面，
当前尝试：
<Routes>
<Route path="/" element={<Home />} />
<Route path="/users" element={<Users />} />
<Route path=":id" element={<UserPage/>} /
浏览 7提问于2020-11-18得票数 0
1回答
错误：[AdminRoute]不是<Route>组件。<Routes>的所有组件子组件必须是<Route>或<React.Fragment>
reactjs、react-router、react-router-dom
我想要通过身份验证的路由，如果用户没有登录页面，就不能访问，就像某人进入url localhost./admin/dashboard时，他不应该能够导航，相反，如果没有登录，他应该被带到登录页面。
我正在使用react路由器v6并为我的应用程序创建私有路由。
AdminRoute.js文件代码如下
import React from "react";
import { Route, Navigate} from 'react-router-dom';
import { isAuthenticated } from "../helper/auth"
浏览 4提问于2021-12-20得票数 2
回答已采纳
1回答
用react路由器嵌套相关路由
reactjs、react-router、react-router-v4、react-router-dom
我有一个类别索引页面，它链接到特定于该类别的产品的产品索引页。那么多都在起作用。但是，当我试图点击链接到特定于该产品的显示组件的产品时，我遇到了麻烦。下面是我的代码：
router.js
import React from 'react';
import { Router, Route, Switch } from 'react-router';
import createBrowserHistory from 'history/createBrowserHistory'
import App from './App';
impo
浏览 1提问于2017-11-01得票数 1
回答已采纳
3回答
在react应用程序中手动导航时状态丢失。
reactjs、redux、react-router、state
快速背景-我有一个React应用程序创建使用CRA CLI。在我的App.js中使用BrowserRouter和react-router-dom路由设置了两个页面或路由。一个是/products，它显示所有的产品。第二个是/product-details，它显示了产品的细节。
Problem 1 -当我进入products页面时，redux状态包含所有的产品信息。当我手动导航到url /product-details时，包含所有产品信息的redux状态将丢失。为什么会发生这种情况？
Problem 2 --除了手动导航之外，我如何以编程方式从/products导航到/product页面，而不丢
浏览 2提问于2019-06-08得票数 3
回答已采纳
1回答
如何使用反应和固体-JS在一起？
reactjs、navigation、solid-js、astrojs
我们正在将我们的web应用程序从React迁移到SolidJS。我们希望通过一次转换一个页面来逐步进行更改。
我一直在使用astro运行react和solidjs。
我遇到的问题是在react页面和solidjs页面之间导航，因为它们使用不同的路由器(react-router-dom和solid/router)。
如何在这两个UI库之间导航？
浏览 3提问于2022-11-09得票数 0
7回答
腾讯云TStack上的云Oracle有哪些优点和应用？
oracle、分布式
云Oracle是基于腾讯云TStack的Oracle云化解决方案，采用开放的“X86服务器+高速以太网络+分布式软件定义存储”架构，有哪些优点和应用呢？
浏览 1603提问于2018-09-19
1回答
从React-Router使用推送时未调度操作-Redux甚至withRouter修复
reactjs、redux、router
将最新版本的React-Router-Redux与最新版本的React-Router-Dom和React-Router一起使用时，推送派单在特定情况下不起作用。以下是详细信息：
版本："react-redux"："^5.0.7"，" react-router -dom"："^4.2.2"，react-router "^4.2.0"，"react-router-redux"："^5.0.0-alpha.9"，
重现步骤:根据React-Router-Redux版本5代码库中的示例设置代
浏览 2提问于2018-03-02得票数 0
2回答
西部数码云主机和腾讯云各有什么优势？
ICP备案、云服务器、云硬盘、云直播、即时通信 IM
我们公司需要买个服务器放软件，我们是四川的。是买本地品牌西部数码，还是推荐大品牌腾讯云呢？
朋友推荐了个代理：www.dayuyun.com/qcloud对比了下。首年价格差不多，但是续费腾讯云有点贵，我该怎么选择呢？
浏览 771提问于2019-02-15
2回答
当重新加载一个有角度的应用程序时，总是到根页面，忽略路由。
angular、angular-routing、angular-router
我有一个简单的角度应用程序，它使用router。
我的路由逻辑很简单
Routes = [
{ path: '', component: MyMainComponent },
{ path: 'error', component: ErrorComponent },
]
如果应用程序中出现错误，则逻辑导航到ErrorComponent，因此我在浏览器url上看到的是http://localhost:4200/error。
如果用户从这里重新加载应用程序(例如，使用CMD+R)，应用程序将返回到Error页面。即使我们重新加载指向现有路由路径的url，是否
浏览 3提问于2020-05-14得票数 3
回答已采纳
4回答
测试时无法使用MemoryRouter导航到路径
react-router、jestjs、enzyme
我已经仔细学习了这些示例，但是我无法获得MemoryRouter (这是您应该如何测试路由组件的方式吗？)用玩笑和酶来做测试。
我想导航到其中一条路线，并将其反映在我的快照中。下面的代码试图使用MemoryRouter导航到"/A“，所以我想我会看到<div>A</div>
import React from 'react';
import Enzyme, {mount} from 'enzyme';
import Adapter from 'enzyme-adapter-react-16';
import {Br
浏览 1提问于2020-06-08得票数 8
回答已采纳
5回答
响应路由器v6在组件外部导航
javascript、reactjs、react-router、react-router-dom
在react路由器v5中，我创建了如下所示的历史对象：
import { createBrowserHistory } from "history";
export const history = createBrowserHistory();
然后把它传给路由器：
import { Router, Switch, Route, Link } from "react-router-dom";
<Router history={history}>
... my routes
</Router>
我这么做是为了在组件之外使用历史记录：
浏览 8提问于2021-11-07得票数 32
回答已采纳
2回答
如何使用react路由器在app.js中呈现多个页面？
javascript、reactjs、react-router
我正在尝试创建一个多页面的react应用程序。反应路由器是正确的方式吗？
由于只有一个名为index.HTML的HTML文件，它从app.js的组件中提取呈现出来的jsx代码。尽管我们可以感觉到使用react路由的多个页面；从技术上讲，反应创建的不是只有一页的应用程序吗？
import React from 'react';
import { BrowerRoute as Router, Route } from 'react-router-dom';
import App from './components/About';
import Ho
浏览 0提问于2019-03-30得票数 8
回答已采纳
1回答
ProductScreen.js:12 Uncaught (承诺) TypeError:无法读取未定义的属性(读“params”)
javascript、node.js、reactjs、express、mern
我遇到了一个问题，不管我做了多少研究/谷歌搜索，我似乎无法解决这个问题，最近两天一直在处理这个错误。首先，我试图在网上找到其他人可能有的答案，但我似乎想不出来，所以现在我需要问一个更有经验的人我做错了什么，请看看我的错误和代码图片，看看你是否可能发现什么东西，我不能.隧道视觉..。
前端是reactjs，后端是节点/表达式。
当我打开主屏幕页面时，每个产品都会从后端加载，没有问题，但是一旦我单击单个产品尝试获得具有唯一id的特定产品页面，初始骨架加载会短暂地在没有任何产品信息的情况下获得，然后就会出现以下错误。
“未处理的拒绝(TypeError)：无法读取未定义的属性(读取'para
浏览 1提问于2021-11-30得票数 0
回答已采纳
32回答
React路由器更改url，但不更改视图
reactjs、react-router
我在react with routing中更改视图时遇到问题。我只想显示一个用户列表，单击每个用户应该导航到一个详细信息页面。这是路由器：
import React from "react";
import ReactDOM from "react-dom";
import { BrowserRouter } from 'react-router-dom';
import Users from "./components/Users";
import { Router, Route } from "react-router
浏览 13提问于2017-04-12得票数 118
2回答
是否可以在react-router中使用material-ui按钮导航？
reactjs、react-router、material-ui、react-router-dom
我有一个web应用程序，我是用material-UI设计的，正如你在下面看到的，我正在使用按钮导航来导航我的基本登录页面组件。
<div className="footer">
<BottomNavigation value={value} onChange={this.handleChange} className={classes.root}>
<BottomNavigationAction label="signal" value="signal" icon={<ShowChart />
浏览 1提问于2018-07-08得票数 31
回答已采纳
1回答
使用react时的URL路由问题
reactjs、react-router-dom
我正在使用react创建web应用程序，目前我在浏览页面时遇到了问题。下面是详细的描述。希望有人能帮我。
我的组件(任务)是这样的(简化)
class Tasks extends Component {
constructor(props) {
super(props);
this.type = props.match.params.type;
}
render(){
return ( <h1>{this.type} </h1> );
}
}
我使用react路由器-dom从一个独立的
浏览 1提问于2017-08-21得票数 0
回答已采纳
1回答
React路由器dom导航方法不能正常工作。
javascript、reactjs、react-router-dom
Hei，我试图建立一个简单的反应应用程序与导航功能。主要的主题是我有3个组件，应用程序、测试和AppShell。App组件是默认(初始)组件。我想要的是每次用户进入App时，我的应用程序都会重定向到Test 。
我面临的问题是，我的重定向只在我第一次加载应用程序时起作用，之后我的重定向就不起作用了。
我与索引页面一起分享了下面的三个组件代码！
索引页
import './index.css';
import App from './App';
import reportWebVitals from './reportWebVita
浏览 3提问于2022-01-14得票数 2
回答已采纳
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
活动推荐
腾讯云开发者
