React-Router JS控制路由跳转

时间:2022-02-26 02:50:56

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控制页面跳转&comma;清缓存,强制刷新页面

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

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

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

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

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

随机推荐

  1. log4net&period;redis&plus;logstash&plus;kibana&plus;elasticsearch&plus;redis 实现日志系统

    前端时间写了个随笔 log4net.NoSql +ElasticSearch 实现日志记录 ,因项目原因需要把日志根java平台的同事集成采用logstash+kibana+elasticsearch ...

  2. Think in java浏览一

    Think in java作为java语言的圣经书籍之一,几乎成为每个java程序员必看的书籍,不看都不好意思说自己是java程序员,不过一般也不说自己认真看了,就说自己翻了翻.作为写安卓的,当然也要 ...

  3. 表单提交中get与post的区别

    在Form里面,可以使用post也可以使用get.它们都是method的合法取值. 1. get是从服务器上获取数据,post是向服务器传送数据.   2. get是把参数数据队列加到提交表单的ACT ...

  4. If only it could be all the same like we first me

    为什么 你当时对我好 Why? You nice to me at that time. 又为什么 现在变得冷淡了 Why? Now you give a cold shoulder to me. 我 ...

  5. objective-c 2&period;0的字面量Literals

    obj-c 2.0增加了许多核心对象字面量的简单语法,向ruby学习吗? 直接上代码: #import <Foundation/Foundation.h> int main(void){ ...

  6. Python装饰器 &lbrack;1&rsqb;

    装饰器本身是个函数 import time def log(func): def wrapper(*args, **kwargs): start = time.time() result = func ...

  7. HashMap的源码,实现原理,底层结构

    转载一遍不错的文章,让你深入了解HashMap http://www.cnblogs.com/ITtangtang/p/3948406.html

  8. 3月25 JavaScript 练习题

    一个关于找7的题 <script type="text/javascript" language="javascript"> for(var i=1 ...

  9. 在Windows下搭建Android开发环境及遇到的问题

    转载1:http://www.cnblogs.com/xdp-gacl/p/4322165.html 转载2:http://www.cnblogs.com/zoupeiyang/p/4034517.h ...

  10. Spring介绍及配置&lpar;XML文件配置和注解配置&rpar;

    本节内容: Spring介绍 Spring搭建 Spring概念 Spring配置讲解 使用注解配置Spring 一.Spring介绍 1. 什么是Spring Spring是一个开源框架,Sprin ...