react中实现在js中内部跳转路由,有两种方法。

方法一:

import PropTypes from 'prop-types';
export default class Header extends Component {
static contextTypes = {
router: PropTypes.object.isRequired,
}
constructor(props) {
super(props);
this.state = {
keyword:"",
channelList:[]
};
this.handleToSearch=this.handleToSearch.bind(this);
}
handleToSearch() {
if(this.state.keyword){
this.context.router.history.push(`/news_list/search/${this.props.channelId}/${this.state.keyword}`)
}
}
render() {
return (
<div className="wrapper">
小星星小星星
</div>
);
}
}

方法二:

this.props.history.push('/download')

跳转到外链:

window.location.href = 'https://你的url'

在页面中给一个按钮绑定绑定跳转,如果跳转到项目的路由,引入react-router的Link

使用<Link to="/download">下载</Link> 形式跳转,如果希望页面从新页面打开,加

 target="_blank"

如果跳转到一个外链,使用a标签,如果希望页面从新页面打开,除了加target,

 target="_blank"

还要加一个rel:

<span><a href="https://internal.zhongwentoutiao.com/admin/news_list" target="_blank" rel="noopener noreferrer">管理员入口</a></span>

react跳转url,跳转外链,新页面打开页面的更多相关文章

  1. WordPress外链新窗口打开并使用php页面go跳转

    之前浏览别人的博客网站,打开外链时会有一个等待时间的代码,虽然不知道有什么用,但觉的挺有档次..今天正好看到教程,就自己也加上了,就复制粘贴些代码可以了 首先创建一个php文件,名字随便,如果你不想改 ...

  2. jQuery外链新窗口打开

    对于外链,为了留住用户在本站,我们通常会使用新窗口打开,你可以设置target="_blank".然而手动一个是麻烦,另一个则是有可能会遗漏,本文通过jQuery查询要点击的链接, ...

  3. html实现a元素href的URL链接自动刷新或新窗口打开

    有时我们想实现这样一个功能,点击一个链接,如果这个链接浏览器已经打开过,则刷新已经打开的链接窗口:如果这个链接没有打开过,则使用新窗口打开这个链接页面. 这是一个非常好的体验增强功能,可以有效避免浏览 ...

  4. react 在新窗口 打开页面

    遇到这个需求 首先通过 Link a去尝试直接跳转.发现2个问题 1.Link跳转 会自动进行登录校验,我设想是路由没有匹配到,去验证后大致排除了. 因为这个链接 直接粘贴到浏览器 是可以访问到的. ...

  5. 【转载】实现a元素href URL链接自动刷新或新窗口打开

    又是我偶像的新文,这个小技巧的用户体验真的非常非常棒! 文章转载自 张鑫旭-鑫空间-鑫生活 http://www.zhangxinxu.com/ 原文链接:https://www.zhangxinxu ...

  6. URL跳转与webview安全浅谈

    URL跳转与webview安全浅谈 我博客的两篇文章拼接在一起所以可能看起来有些乱 起因 在一次测试中我用burpsuite搜索了关键词url找到了某处url我测试了一下发现waf拦截了指向外域的请求 ...

  7. 二、ionic如何使用外链

    1.ionic如何使用外链并返回原有页面? html如下: 对应的controller如下: (function() { angular.module('app').controller('extra ...

  8. 小程序外链跳转web-view系列问题

    1.当小程序需要跳转外链时要上小程序后台配置业务域名,配置业务域名需要上传一个验证文件到你跳转的外链的服务器上的根目录里: 2. (1)第一种方法:.当小程序在同一个页面根据后台接口获取的url进行小 ...

  9. 【原创】Ionic单页应用跳转外链,构造路由返回的解决办法及代码

    在开发广汽菲克微信企业号的填单审批webApp的时候出现了一个问题: 单据是带有附件的,而且存在各种不同的格式,需要后台处理后给前台链接地址,点击预览,微信浏览器的特性就是只能存在一个浏览器窗口, 这 ...

随机推荐

  1. 2016年3月15日Android实习日记

    1.解决了ScrollView滑动冲突问题. 2.设置好了“查看详解”与“题目编号”的部分. 3.完成了app启动图片的设置,并在启动的过程中开辟新的线程连接服务器并开启监听数据. 别忘了注册启动Ac ...

  2. NullPointerExceptio异常出现的情况

    NullPointerException是java.lang.NullPointerException的简称,是Java语言中的一个异常类,位于java.lang包中,父类是java.lang.Run ...

  3. 230. 二叉搜索树中第K小的元素

    230. 二叉搜索树中第K小的元素 题意 给定一个二叉搜索树,编写一个函数 kthSmallest 来查找其中第 k 个最小的元素. 你可以假设 k 总是有效的,1 ≤ k ≤ 二叉搜索树元素个数. ...

  4. linux find命令用法

    Linux下find命令在目录结构中搜索文件,并执行指定的操作.Linux下find命令提供了相当多的查找条件,功能很强大.由于find具有强大的功能,所以它的选项也很多,其中大部分选项都值得我们花时 ...

  5. C++泛型编程(2)--通过排序和查找元素理解迭代器

    许多C++开源库(stl,opencv,ros和blas等)都使用了大量的泛型编程的思想,如果不理解这些思想,将很难看懂代码,而<泛型编程与STL>一书对理解泛型编程思想非常的有帮助,这里 ...

  6. java程序中实现打开 某个指定浏览器

    package com.test; import java.lang.reflect.Method; //实现打开浏览器并跳到指定网址的类 public class BareBonesBrowserL ...

  7. [java web]Idea+maven+spring4+hibernate5+struts2整合过程

    摘要 最近也在网上找了些教程,试着使用maven进行包依赖关系的管理,也尝试着通过注解的方式来整合ssh框架.在这个过程中,踩了不少的坑.折腾很长时间,才算把架子折腾起来.这里把结果整理下,作为以后工 ...

  8. Sql Server中sql语句自己主动换行

    怎么让sql server中的sql语句自己主动换行呢? 例如以下图: 工具--选项--全部语言 watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvamlhbm ...

  9. python测试开发django-44.xadmin自定义菜单项

    前言 xadmin后台的菜单项是放到一个app下的,并且里面的排序是按字母a-z排序,有时候我们需要划分多个项,需要自定义菜单列表,可以通过重写CommAdminView类实现. xadmin后台提供 ...

  10. Linux shell命令 cp 加上-f还是提示是否覆盖

    这是由于环境变量中有 allias cp='cp -i' 为了去掉这个系统自带的别名,能够使用grep -r --include="*" "alias cp"  ...