Как выполнить функцию возврата в React
Я использую реагирующий маршрутизатор v.4, и я хотел бы выполнить некоторую функцию возврата.
Мой текущий код выглядит следующим образом:
<HashRouter>
<Switch>
<Route exact path='/' component = {Main}/>
<Route path='/secondview' component = {SecondView}/>
<Route path='/traineeships' render = {()=>(<Traineeship rootState = {this.state} setRootState = {this.setState.bind(this)} />)}/>
<Route path='/information-filter' render = {()=>(<InformationFilter rootState = {this.state} setRootState = {this.setState.bind(this)} />)}/>
<Route path='/find-work' render = {()=>(<FindWork rootState = {this.state} setRootState = {this.setState.bind(this)} />)}/>
<Route path='/information-job' render = {()=>(<InformationJob rootState = {this.state} setRootState = {this.setState.bind(this)} />)}/>
<Redirect from='*' to='/' />
</Switch>
Я пробовал несколько вариантов, например this.props.history.go(-1), на других компонентах, но получал неопределенные ошибки.
Кто-нибудь знает, как выполнить функцию возврата в моем случае?
вы используете withRouter для своих страниц? github.com/ReactTraining/react-router/blob/master/packages/…
Пожалуйста, предоставьте минимальный воспроизводимый пример, чтобы получить лучший ответ.
![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)
Ответы 2
В зависимости от версии react-router (в данном случае 3.0) вы можете включить BrowserHistory first и сделать:
const BrowserHistory = require('react-router/lib/BrowserHistory').default;
и вы можете использовать его в JSX:
<button onClick = {BrowserHistory.goBack}>Back</button>
И этот код в вашем файле приложения:
<Router history = {BrowserHistory}>
<Route path = "/" component = {App} />
</Router>
Я получаю сообщение об ошибке: не могу найти модуль «response-router / lib / BrowserHistory»
@Mizlul Я не заметил, что вы используете v4 :)
Вы можете использовать withRouter, если вам нужно получить доступ к объекту истории:
import React from 'react'
import { withRouter } from 'react-router'
class SecondView extends React.Component {
render() {
return (
<button onClick = {() => this.props.history.go(-1)} />
)
}
}
const SecondViewnWithRouter = withRouter(SecondView)
withRouter will pass updated match, location, and history props to the wrapped component whenever it renders.
спасибо, это работает!
@VicJordan Я получаю Uncaught TypeError: не могу прочитать свойство goBack для undefined, когда я делаю то же самое, что и ответ на этот дублированный запрос!