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 这个属性的, 如果不是的话,则没有这个属性.

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

  1. react项目中引入了redux后js控制路由跳转方案

    如果你的项目中并没有用到redux,那本文你可以忽略 问题引入 纯粹的单页面react应用中,通过this.props.history.push('/list')就可以进行路由跳转,但是加上了redu ...

  2. react-router JS 控制路由跳转(转载)

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

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

    问题 当我们使用react-router v3的时候,我们想跳转路由,我们一般这样处理 我们从react-router导出browserHistory. 我们使用browserHistory.push ...

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

    js 控制页面跳转的5种方法 编程式导航: 点击跳转路由,称编程式导航,用js编写代码跳转. History是bom中的 History.back是回退一页 Histiory.go(1)前进一页 Hi ...

  5. JS控制div跳转到指定的位置的几种解决方案总结

    原文:http://www.jb51.net/article/96574.htm 这篇文章主要介绍了JS控制div跳转到指定的位置的几种解决方案总结,小编觉得挺不错的,现在分享给大家,也给大家做个参考 ...

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

    Jsp 页面跳转的几种方法 1. RequestDispatcher.forward() 在服务器端起作用,当使用forward()时,Servlet engine传递HTTP请求从当前的Servle ...

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

    单看标题,必定满脸蒙13. 其实,想表达的仅仅是,在js中通过window.location.href控制页面跳转时,有时会跳转至缓存页面,并没有真正去请求要跳转的地址,导致页面数据未能及时加载刷新. ...

  8. nuxt.js同路由跳转参数不同,mounted不执行时

    watch: { '$route'(to, from) { if (to.fullPath !== from.fullPath) { this.$nextTick(() => { // 不加th ...

  9. vue路由--使用router.push进行路由跳转

    手机赚钱怎么赚,给大家推荐一个手机赚钱APP汇总平台:手指乐(http://www.szhile.com/),辛苦搬砖之余用闲余时间动动手指,就可以日赚数百元 route-link是在html中静态定 ...

随机推荐

  1. Golang 知识图谱

  2. Python WSGI接口

    WSGI(Web Server Gateway Interface 或 Python Web Server Gateway Interface ),是为 Python 语言定义的 Web 服务器与 W ...

  3. C#语法之委托和事件

    从大学就开始做C#这块,也做C#几年了,最近又从ios转回.Net,继续做C#,之前也没有写博客的习惯,写博客也是从我做ios的时候开始的,现在既然又做回了.net,那就写点关于.Net的博客,可能在 ...

  4. 《小岛经济学--鱼、美元和经济的故事》Digest

    作者:彼得.D.希夫(Peter D. Schiff)安德鲁.J.希(Andrew J. Schiff) How an Economy Grows and Why It Crashes 打车到清华,车 ...

  5. bind9配置转发服务

    修改bind主配置文件 $ vi /etc/named.conf//// named.conf//// Provided by Red Hat bind package to configure th ...

  6. sql 数据库数据 批量判断修改

    A表B表相关联  更新B表中的VisitWeek字段值 CCD_PartnerVisit 此为B表 Dell_FiscalWeek  此为A表 UPDATE CCD_PartnerVisit SET ...

  7. ipV4&V6的区别

    1. 更大的地址空间.IPv4中规定IP地址长度为32,即有2^32-1个地址:而IPv6中IP地址的长度为128,即有2^128-1个地址. 2. 更小的路由表.IPv6的地址分配一开始就遵循聚类( ...

  8. 整理 node-sass 安装失败的原因及解决办法

    npm install 时偶尔遇到报错:没有安装python或node-sass 安装失败的问题,百度之后发现是被墙了,但根据百度的方法换了淘宝镜像和用了vpn都安装失败,最后发现原来是因为没有卸载之 ...

  9. 使用AutoFac组织多项目应用程序

    较复杂的应用程序都是由多个项目组织成的,项目可以划分成程序集(Assemblies)和宿主(Hosts),也就是应用程序的入口.      Assemblies 通常是常见的类库项目,包括可以重用的功 ...

  10. LeetCode 527---Word Abbreviation

    527. Word Abbreviation Given an array of n distinct non-empty strings, you need to generate minimal ...