首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >React路由器无需重新加载页面即可更改url

问React路由器无需重新加载页面即可更改url
EN

Stack Overflow用户
提问于 2016-04-26 11:17:04
回答 3查看 28K关注 0票数 19

当我使用react-router 0.13.3时,它是正常的:我正在改变url,并且在不重新加载的情况下进行转换。

现在,在react-router2.0中,如果我手动更改url,我的应用程序将完全重新加载,而不是简单的重定向。我该如何修复它?

我想使用这个:

代码语言:javascript
复制
<a href="/routename">link</a>

取而代之的是:

代码语言:javascript
复制
<Link to="/routename">link</Link>

在少数特殊情况下。

路线

代码语言:javascript
复制
import {Router, Route, IndexRoute} from "react-router";
import App from './components/App';
import FrontPage from './components/frontPage/FrontPage';
import User from './components/user/User';
module.exports = (
    <Router>
        <Route path="/" component={App}>
            <IndexRoute component={FrontPage}/>
            <Route path="/user/:userid" component={User}/>
        </Route>
    </Router>
);
EN

回答 3

Stack Overflow用户

发布于 2016-05-03 15:34:13

没有解决方案。我们可以使用onClick脚本或Link。

https://github.com/reactjs/react-router/issues/3411

票数 3
EN

Stack Overflow用户

发布于 2020-04-03 15:05:18

React路由器v4 -重定向组件

react-router v4推荐的方式是允许您的render方法捕获重定向。使用state或props来确定是否需要显示重定向组件。

  1. 首先,从react-router导入Redirect

从'react-router';

  • Define导入{重定向}单击处理程序

handleOnClick = () => { //一些操作...//然后重定向this.setState({ redirect : true});}

  • 更改呈现方法,

render() { if (this.state.redirect) { return;} return (按钮);}

代码语言:javascript
复制
- Example code :

从‘react-router’导入{ Redirect };导出默认类ConfirmationDialog扩展组件{构造函数(Props){ConfirmationDialog(Props);this.state ={ redirect : false }} handleOnClick = () => { //一些操作...//然后重定向this.setState({ redirect : true});} render() { if (this.state.redirect) { return;} return (//您的代码按钮);}}

​

参考:https://reacttraining.com/react-router/web/api/Redirect

票数 2
EN

Stack Overflow用户

发布于 2017-04-23 00:03:52

通常是由于一些错误,使用DevTools (Shift+CTRL+I)在chrome上运行web。在控制台中启用保留日志(保留日志),并查看发生了什么,您可能会看到一些错误,解决它,它应该工作而不刷新。

票数 1
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/36854642

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档