如何在reactjs中向导航栏添加后退按钮

Question

我正在寻找一些示例或帮助我如何在我的reactjs应用程序中添加一个后退按钮...当我点击导航栏上的Go Back时，下面会抛出此错误

TypeError: Cannot read property 'goBack' of undefined

import React, { Component } from 'react'
import { Navbar, Nav, NavItem } from 'react-bootstrap';
import { withRouter, Link } from 'react-router-dom';
import './Navbar.css'

export default class Navbar extends Component  {
  constructor(props) {
    super(props);
  }

  goBack = () => {
    this.props.history.goBack();
  }

  render() {
    return (
      <Navbar default collapseOnSelect>
        <Navbar.Header>
          <Navbar.Brand>
            My App
          </Navbar.Brand>
          <Navbar.Toggle />
        </Navbar.Header>
        <Navbar.Collapse>
          <Nav pullRight>
            <NavItem eventKey={1} href="https://app.com">
              Home
            </NavItem>
            <NavItem onClick={this.goBack}>Go Back</NavItem>
          </Nav>
        </Navbar.Collapse>
      </Navbar>
    )
  }
}

Answer 1

如果使用react-router-dom你可以使用this.props.history.goBack()方法，它可以让你退一步。了解更多关于可以与history一起使用的方法

Answer 2

你可以使用qazxsw poi

this.props.history.goBack