
react-router中的嵌套路由
我正在React-Router中设置一些嵌套路由(我正在使用v0.11.6),但是每当我尝试访问其中一个嵌套路由时,都会触发父路由。我的路线如下所示:<Route handler={App}> <Route name="home" path="/" handler={availableRoutes.Splash} /> <DefaultRoute handler={availableRoutes.Splash} /> <Route name="dashboard" handler={ava...
2024-01-10
react-router中的查询字符串
我正在尝试使用查询字符串设置路由路径。符合以下条件的东西:www.mywebsite.com/results?query1=:query1&query2=:query2&query3=:query3我将像这样过渡到“结果”组件:<Route path="/" component={Main}> <IndexRoute component={Home} /> <Route path="results?query1=:query1&query2=:query2&query3=:query3" comp...
2024-01-10
使用react-router检测路由更改
我必须根据浏览历史实现一些业务逻辑。我想做的是这样的:reactRouter.onUrlChange(url => { this.history.push(url);});URL更新后,有什么方法可以接收来自react-router的回调吗?回答:history.listen()尝试检测路线变化时,可以使用功能。考虑到您正在使用react-router v4,请用withRouterHOC 包装您的组件以访问history...
2024-01-10
react-router没有渲染任何东西
我创建了我的应用,create-react-app并尝试react-router在其上使用。但它根本不起作用。这是我的Header.js。 import React, { Component } from 'react';class Header extends Component { render() { return ( <nav> <div className="nav-wrapper blue darken-1"> ...
2024-01-10
React-Router外部链接
由于我正在使用react-router来处理我的React应用程序中的路由,因此我很好奇是否有一种方法可以重定向到外部资源。说某人点击:example.com/privacy-policy我希望它重定向到:example.zendesk.com/hc/en-us/articles/123456789-Privacy-Policies我发现避免在index.html加载类似以下内容的纯JS中编写零帮助:if ( window.location.path ...
2024-01-10
使用react-router登录后自动重定向
我想在我的 应用程序中建立一个Facebook登录名。我在登录事件上注册了一个侦听器,并且希望将用户重定向到('/dashboard'如果他们已登录)。该怎么办?location.push效果不佳,除非完全重新加载了页面。回答:该Router实例从返回Router.create可以通过左右(或者,如果内部的阵营组件,你可以从它的上...
2024-01-10
react-router位置与任何路由都不匹配
我陷入了反应路由器路由。我收到错误消息:Warning: [react-router] Location "/FluxApp/" did not match any routes这是我的 :var React = require('react');var ReactDOM = require('react-dom');var Router = require('react-router').Router;var Route = require('react-router').Route;var Index...
2024-01-10
react-router返回页面如何配置历史记录?
谁能告诉我如何返回上一页而不是特定路线?使用此代码时:var BackButton = React.createClass({ mixins: [Router.Navigation], render: function() { return ( <button className="button icon-left" onClick={this.navigateBack}> Back </button> ...
2024-01-10
如何使用react-router-dom创建动态路由?
我学会了反应,知道如何创建静态路由,但无法弄清楚动态路由。也许有人可以解释,我将不胜感激。假设有两个组件,一个用于渲染路线,另一个作为路线的模板。也许代码有问题,但希望您理解..这是呈现路线的组件:import React, { Component } from 'react';import axios from 'axios';import Hero from './Hero';class He...
2024-01-10
在React-Router中未调用onEnter
好吧,我受够了尝试。该onEnter方法不起作用。知道为什么吗?// Authentication "before" filterfunction requireAuth(nextState, replace){ console.log("called"); // => Is not triggered at all if (!isLoggedIn()) { replace({ pathname: '/front' }) }}// Render the apprender( ...
2024-01-10
React Router-嵌套路由不起作用
我的目标是让http:// mydomain /route1渲染React组件Component1和http:// mydomain /route2渲染Component2。因此,我认为编写如下的路由是很自然的: <Route name="route1" handler={Component1}> <Route name="route2" handler={Component2} /> </Route> <DefaultRoute name="home" handler=...
2024-01-10
客户端路由(使用react-router)和服务器端路由
我一直在思考,我对客户端和服务器之间的路由感到困惑。假设我在将请求发送回Web浏览器之前使用ReactJS进行服务器端渲染,并使用react-router作为客户端路由在页面之间切换而不刷新为SPA。我想到的是:路线如何解释?例如,从首页(/home)到帖子页面(/posts)的请求路由在服务器端还是客户端去...
2024-01-10
使用react-router-dom重定向到第三方URL
我非常了解我想对组件进行条件渲染的react-router-dom。如果未登录use,则将他重定向到某个第三方URL例如,下面的代码看起来很整洁,可以正常工作<Route exact path="/home" render={() => ( isLoggedIn() ? ( <Redirect to="/front"/> ) : ( <Home /> ))}/>让我们在上面的示例中说,如果我想重定向to 该怎么做?如果我...
2024-01-10
react-redux中的ownProps是什么?
我正在阅读react-redux上的API并查看Redux的github示例之一:Reduxtodo应用其中一个容器FilterLink具有mapDispatchToProps(和mapStateToProps)接受两个参数,其中一个是ownprops。const mapDispatchToProps = (dispatch, ownProps) => ({ onClick: () => { dispatch(setVisibilityFilter(ownProps.filter)) }})API...
2024-01-10
React-Router在新标签页中打开链接
有没有办法让React Router在新标签页中打开链接?我尝试了一下,但没有成功。<Link to="chart" target="_blank" query={{test: this.props.test}} >Test</Link>可以通过向onClick="foo"Link 添加类似于我上面的内容来使其模糊,但是会出现控制台错误。谢谢。回答:我认为Link组件没有它的支持。您可以通过创建标签并使用Nav...
2024-01-10
使用React-Router检测用户离开页面
我希望我的ReactJS应用在离开特定页面时通知用户。特别是一条弹出消息,提醒他/她进行以下操作:“更改已保存,但尚未发布。现在执行吗?”我应该在react-router全局范围内触发此操作,还是可以在react页面/组件内完成此操作?我还没有发现任何关于后者的信息,我宁愿避免使用第一个。除非当然...
2024-01-10
在Redux中间件中使用react-router进行重定向
我创建了一个中间件,用于检查请求是否返回无效的访问响应。如果状态为401,我想将用户重定向到登录页面这是中间件代码import React from 'react';import { push, replace } from 'react-router-redux';const auth_check = ({ getState }) => { return (next) => (action) => { if(action.payload != undefined && action.payloa...
2024-01-10
React-router-dom和symfony路由
我遇到了Twig渲染和React生根的问题。React-router-dom和symfony路由如何在不需要修改symfony路由的情况下在树枝模板中使用React路由器dom?回答:如果我理解正确的话:可以包括和运行JS(反应)在树枝文件,但是生成正确的路由(因为我知道你想混合反应,symfony中)YPU需要在js中使用symfony路由 - 通过使...
2024-01-10
react-router“无法读取未定义的属性“ push”
我是新来的反应和反应路由器。react的问题在于,在我的应用程序的某些页面上,react-router正在运行,并且出现一些类似的错误:“无法读取未定义的属性’push’”。我正在使用反应0.14.1我的路由代码如下所示:render(<Router history={hashHistory}> <Route path="/" component={Loginpanel}/> <Route path="Index" component={In...
2024-01-10
在React Router中渲染多个组件
我习惯于具有多个产量区域的应用程序布局,即用于内容区域和顶部栏标题。我想在React Router中实现类似的功能。例如:<Router> <Route path="/" component = { AppLayout }> <Route path="list" component = { ListView } topBarComponent = { ListTopBar }/> </Route></Router>AppLayout:<div classNa...
2024-01-10
react-router如何通过prop将参数传递给其他组件?
到目前为止,我对如何通过参数将属性从一个组件传递到另一组件的了解程度如下//开始:我的知识范围假设存在一些topic在A.jsx中调用的状态变量。我想将此传递给B.jsx,所以我执行以下操作B = require('./B.jsx')getInitialState: function() {return {topic: "Weather"}}<B params = {this.state.topic}>然后在B.jsx中,我可以做...
2024-01-10
在React-router中拦截/处理浏览器的后退按钮?
我正在使用Material-ui的选项卡,这些选项卡是受控的,并且将它们用于(React-router)链接,如下所示: <Tab value={0} label="dashboard" containerElement={<Link to="/dashboard/home"/>}/> <Tab value={1} label="users" containerElement={<Link to="/dashboard/users"/>} /> <Tab value={2} label="da...
2024-01-10
React-router-dom-链接更改URL但不呈现
我是React的新手,我已经<Link>从dy数据中转到下一个或上一个项目(例如,如果我在user / 2视图上,则上一个链接转到user /1,下一个链接转到user / 3 ),则正确更改了url,但完全不呈现该组件,并且根本不重新加载数据。我读到这是由于组件未检测到子代未更改状态,所以父组件未呈现。我尝试使用,...
2024-01-10
使用React Router以编程方式导航
通过使用react-router我可以使用Link元素创建由React Router本机处理的链接。我在内部看到它的呼唤this.context.transitionTo(...)。我想导航。不是来自链接,而是来自下拉菜单(例如)。如何在代码中执行此操作?什么this.context啊我看到了Navigationmixin,但是如果没有,我可以这样做mixins吗?回答:useHistory如...
2024-01-10
如何从React-Router中的URL中删除哈希
我正在使用react-router进行路由,并使用hashHistory选项,以便可以从浏览器刷新页面或指定现有路由之一的url并到达正确的页面。它工作正常,但我在URL中看到的哈希是这样的:http:// localhost /#/ login?_k = ya6z6i这是我的路由配置:ReactDOM.render(( <Router history={hashHistory}> <Route path='/' component={MasterPage}>...
2024-01-10
