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. Spring缓存注解@Cache,@CachePut , @CacheEvict，@CacheConfig使用

    @Cacheable.@CachePut.@CacheEvict 注释介绍 表 1. @Cacheable 作用和配置方法 @Cacheable 的作用 主要针对方法配置,能够根据方法的请求参数对其结 ...

  2. redis入门基础

    环境: centos 一.安装 sudo su cd wget http://labfile.oss.aliyuncs.com/courses/106/redis-2.8.4.tar.gz tar - ...

  3. java 二分法

    源码 public class Dichotomy { public static void main(String[] args){ int[] array = new int[12]; for(i ...

  4. C# base64 和图片互转

    C# imgage图片转base64字符/base64字符串转图片另存成 //图片转为base64编码的字符串 protected string ImgToBase64String(string Im ...

  5. Ubuntu使用心得

    因为开发学习需要,也接触了一些Ubuntu系统,玩崩了两次系统之后,也学到了一些东西. -------------------------------------------------------- ...

  6. css points

    <style type="text/css" rel="stylesheet">.a{ width:500px; height:400px;对放置图 ...

  7. js面向对象设计之class中一些坑和技巧

    this的指向 super 类工厂,类中定义方法名时,可以使用字符串,这就可以创建工厂函数(类似模板类) Generator 函数 静态属性和私有属性.私有方法 new.target

  8. SQL Server 修改表结构被阻止 解决办法

    在我们的程序开发中,有时候会由于需求的变化而要修改数据库中的表结构.可能是增减列,也可能是修改数据类型,或者修改列名等等.但修改表结构是个危险操作,默认情况下,当你修改表结构时,会弹出如下提示框 上图 ...

  9. elixir 模块

    模块定义  defmodule 函数定义  def 私有函数  defp  --相当于其他语言 private iex(29)> defmodule Math do...(29)> def ...

  10. NTP POOL PROJECT:全球最大的免费NTP服务集群

    pool.ntp.org项目是一个提供可靠易用的NTP服务的虚拟集群,它作为一个大的NP服务器可以支撑全球数百万客户端使用.该项目允许那些能提供NTP服务的服务器加入到该集群中,截止2012年8月份, ...