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. POJ 1251 Jungle Roads（Kruskal算法求解MST）

    题目: The Head Elder of the tropical island of Lagrishan has a problem. A burst of foreign aid money w ...

  2. 一个实用的却被忽略的命名空间：Microsoft.VisualBasic

    当你看到这个命名空间的时候,别因为是VB的东西就匆忙关掉网页,那将会是您的损失,此命名空间中的资源最初目的是为了简化VB.NET开发而创建的,所以Microsoft.VisualBasic并不属于Sy ...

  3. JS数组sort比较函数

    转载:http://www.cnblogs.com/ljchow/archive/2010/06/30/1768683.html 我们知道,数组的sort方法可以对数组元素进行排序,默认是按ASCII ...

  4. 转载：SQL按照日、周、月、年统计数据的方法

    转载源:http://www.jb51.net/article/42613.htm SQL按照日.周.月.季度.年统计数据的方法 方式一: --按日 select sum(consume),day([ ...

  5. AVPlayer 音乐播放后台播放，以及锁屏主题设置

    第一步:在appDelegate中通知app支持后台播放:在方法 - (BOOL)application:(UIApplication *)application didFinishLaunching ...

  6. Centos系统下卸载、安装MySQL及用户的创建、授权和使用（详细。。。。）

    由于经常使用linux系统,并且大数据环境搭建中经常会使用到mysql,不像windows系统下的安装,今天有点空写一篇,下面我给大家演示一遍. 主要有三部分内容: 1.MySQL的卸载 2.MySQ ...

  7. 分析Ethernet标准和Ieee802.3标准规定的MAC层帧结构

    分析所用软件下载:Wireshark-win32-1.10.2.exe 阅读导览 1. 学习Wireshark的安装与使用 2. 熟悉Wireshark的操作界面与功能 3. 设计应用以获取以太网链路 ...

  8. 【PyQt5 学习记录】008：改变窗口样式之二

    super(MainWindow, self).__init__(parent, flags=Qt.Widget) 首先需要关闭窗口的默认样式,以方便定时想要的样式: self.setWindowFl ...

  9. js面向对象设计之class继承

    EcmaScript 2015 (又称ES6)通过一些新的关键字,使类成为了JS中一个新的一等公民.但是目前为止,这些关于类的新关键字仅仅是建立在旧的原型系统上的语法糖,所以它们并没有带来任何的新特性 ...

  10. 前端 ajax 获取后台json数据 解析

    先贴代码 function edit(node) { ).text(); alert(customerid) $.ajax({ type: "post", url: "/ ...