React-Router JS控制路由跳转

时间: 2016-04-12 15:01:20 作者: zhongxia

React-Router 控制路由跳转的方式,目前知道的有两种[Link 链接, 和 JS控制跳转 ] ,但是最常用的就是用 Link(类似 a 标签),来进行跳转

JS实现方式

由于有时候需要点击某个标签,或者某一个按钮,来动态的实现页面跳转的地址,这个就需要使用到 JS 来实现

实现的代码很简单

this.props.history.pushState(null, url);

注意:如果是根据路由规则返回的组件, props 上是包含 history 这个属性的, 如果不是的话,则没有这个属性.

时间： 2024-11-05 14:47:26

React-Router JS控制路由跳转的相关文章

react-router JS 控制路由跳转（转载）

Link组件用于正常的用户点击跳转,但是有时还需要表单跳转.点击按钮跳转等操作.这些情况怎么跟React Router对接呢? 下面是一个表单. <form onSubmit={this.handleSubmit}> <input type="text" placeholder="userName"/> <input type="text" placeholder="repo"/> <

react-router v4 使用 history 控制路由跳转

问题当我们使用react-router v3的时候,我们想跳转路由,我们一般这样处理我们从react-router导出browserHistory. 我们使用browserHistory.push()等等方法操作路由跳转. 类似下面这样 import browserHistory from 'react-router'; export function addProduct(props) { return dispatch => axios.post(`xxx`, props, config

React 子组件进行路由跳转

react路由跳转: 1.DOM跳转 <Link href={`/device/list`} to={`/device/add`}></Link> 2.js跳转 this.props.history.push("/device/add") 具体路由跳转细节,请自行百度问题: 父组件: <TabPane tab="终端配置" key="1"> <A/> </TabPane> <Ta

Jsp页面跳转和js控制页面跳转的几种方法

Jsp 页面跳转的几种方法 1. RequestDispatcher.forward() 在服务器端起作用,当使用forward()时,Servlet engine传递HTTP请求从当前的Servlet或者是JSP到另外的一个Servlet.JSP 或普通HTML文件,也即你的form提交至a.jsp,在a.jsp用到了forward()重定向至b.jsp,此时form提交的所有信息在 b.jsp都可以获得,参数自动传递. 但forward()无法重定向至有frame的jsp文件,可以重定向至有

JS弹出框、对话框、提示框，JS关闭窗口、关闭页面和JS控制页面跳转

一.JS弹出框.对话框.提示框 //====================== JS最常用三种弹出对话框 ======================== //1弹出对话框并输出一段提示信息 function ale() { //弹出一个对话框 alert("提示信息!"); } //2弹出一个询问框,有确定和取消按钮 function firm() { //利用对话框返回的值 (true 或者 false) if (confirm("你确定提交吗?")) { a

js控制页面跳转,清缓存，强制刷新页面

单看标题,必定满脸蒙13. 其实,想表达的仅仅是,在js中通过window.location.href控制页面跳转时,有时会跳转至缓存页面,并没有真正去请求要跳转的地址,导致页面数据未能及时加载刷新. 直奔code... 解决办法: 在HTML中埋入隐藏from,通过js调用from进行请求链接地址 <form id='hidden_submit_info' method="post" enctype="multipart/form-data" action=

js 控制页面跳转的5种方法

第一种: 复制代码代码如下: <script language="javascript" type="text/javascript"> window.location.href="login.jsp?backurl="+window.location.href; </script> 第二种: 复制代码代码如下: <script language="javascript"

js控制页面跳转

1.location.href self.location.href: window.location.href='url':重定向页面并刷新,而window.open('url')只表示打开页面,并不刷新 this.location.href: location.href:以上四种都为本页面跳转 parent.location.href:上一层页面跳转(iframe) top.location.href:最外层页面跳转(iframe) 2.window.history.go(number):

React router 4 获取路由参数，跨页面参数

1. match通过路径 <Route path="/path/:name" component={example} /> 路由组件内获取参数使用 this.props.match.params.name 2. query String 通过search //mirrorx中使用push的参数search,link中使用与此类似 actions.routing.push({ pathname: '/path/example', search: `?name={name}`,