所属分类:web前端开发
React返回页面有3种方式,分别是:1、通过“this.props.history.push('/home');”方式返回到上一级页面;2、通过“this.props.history.replace('/home');”方式返回页面;3、通过“window.history.back(-1);”返回页面。
本教程操作环境: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返回页面的几种方式的详细内容,更多请关注zzsucai.com其它相关文章!