Как я могу добавить кнопку "Назад" к моей навигационной панели в реагировать - PullRequest
Новая
       12

Как я могу добавить кнопку "Назад" к моей навигационной панели в реагировать

0 голосов
/ 07 апреля 2019

Я ищу какой-нибудь пример или справку о том, как добавить кнопку «Назад» в свое приложение реагировать ... Ниже выдается эта ошибка, когда я нажимаю кнопку «Вернуться» на панели навигации 

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>
    )
  }
}

Ответы [ 2 ]

0 голосов
/ 08 апреля 2019

Вы можете использовать this.props.history.goBack

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} />
          </Nav>
        </Navbar.Collapse>
      </Navbar>
    )
  }
}
0 голосов
/ 07 апреля 2019

Если вы используете response-router-dom, вы можете использовать метод this.props.history.goBack(), который вернет вас на один шаг назад. чтобы узнать больше о методах, которые вы можете использовать с history

...