ホームページ  >  記事  >  ウェブフロントエンド  >  React でページを返すいくつかの方法

React でページを返すいくつかの方法

藏色散人
藏色散人オリジナル
2022-10-25 17:49:393195ブラウズ

React には、ページに戻る 3 つの方法があります: 1. "this.props.history.push('/home');" を通じて前のページに戻る; 2. 前のページに戻る"this.props.history.push('/home');" を通じてページに戻ります。 props.history.replace('/home');"; を通じてページに戻ります。 3. "window.history.back( -1);"。

React でページを返すいくつかの方法

このチュートリアルの動作環境: Windows7 システム、react18.0.0 バージョン、Dell G3 コンピューター。

React はページを返す方法は何通りありますか?

react 前のレベルのページに戻るモバイル端末の書き方

前のレベルのページに戻るモバイル端末の書き方:

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;

React でページを返すいくつかの方法

推奨学習: 「react ビデオ チュートリアル

以上がReact でページを返すいくつかの方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。