Several ways to return the page in React

React has three ways to return to the page, namely: 1. Return to the previous page through "this.props.history.push('/home');"; 2. Return to the previous page through "this.props.history.push('/home');" Return to the page through props.history.replace('/home');"; 3. Return to the page through "window.history.back(-1);".

The operating environment of this tutorial: windows7 system, react18.0.0 version, Dell G3 computer.

How many ways does React return the page?

react How to write the mobile terminal to return to the previous level page

How to write the mobile terminal to return to the previous level page:

import React, {Component} from 'react';
import './style.less';
 
class Header extends Component {
 
    clickBackHandler (){
        // 返回到上一级页面的几种方法
        //第一种 this.props.history.push('/home');
        //第一种 this.props.history.replace('/home'); 但这两种方法都不好
        //第三种方法,推荐使用
        window.history.back(-1);
    }
 
    render() {
        return (
            <div id="common-header">
                {/*Header 公共头组件*/}
                <span className="back-icon">
                    <i className="icon-chevron-left" onClick={ this.clickBackHandler }></i>
                </span>
                <h1>{ this.props.title }</h1>
            </div>
        );
    }
}
 
export default Header;

Recommended learning: "react video tutorial"

The above is the detailed content of Several ways to return the page in React. For more information, please follow other related articles on the PHP Chinese website!