zoukankan      html  css  js  c++  java
  • react跳转url,跳转外链,新页面打开页面

    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>
  • 相关阅读:
    机器学习之线性回归
    斯坦福机器学习【5】生成学习算法(高斯判别与朴素贝叶斯)
    网络编程
    正则表达式
    Mysql
    python爬虫
    nginx
    maven基础
    sping入门
    河北省重大技术需求征集八稿第一天
  • 原文地址:https://www.cnblogs.com/beileixinqing/p/9529433.html
Copyright © 2011-2022 走看看