История не доступна из реакции-маршрутизатор-модал - PullRequest
Новая
       40

История не доступна из реакции-маршрутизатор-модал

1 голос
/ 12 марта 2019

Здравствуйте. У меня возникла проблема с установкой 'response-router-modal' parentPath для последнего использованного компонента

ModalRoute и ModalContainer являются частью реагирующий маршрутизатор-модальный

App.js 

class App extends Component {
  render() {
    return (
      <main>
        <Navbar />
        <BrowserRouter>
          <div>
            <Switch>
              <Route path="/main" component={ContentDefault} />
              <Route path="/search" component={SearchScreen} />
              <ModalRoute
                path="/register"
                parentPath="/"
                component={RegisterScreen}
              />
              <Route path="/contact" component={ContentDefault} />
              <Route component={ContentDefault} />
            </Switch>
            <ModalContainer />
          </div>
        </BrowserRouter>
        <Footer />
      </main>
    );
  }
}

export default App;

SearchScreen.jsx 

import React, { Component } from "react";
import { withRouter } from "react-router-dom";

class SearchScreen extends Component {
  render() {
    return (
      <main>
        <h1>SearchScreen</h1>
      </main>
    );
  }
}

export default withRouter(SearchScreen);

Например, я на главном экране, затем яперейти к SearchScreen, а затем я открываю модальное с Navbar.Мне нужен мой модал, чтобы вернуться на SearchScreen

1 Ответ

1 голос
/ 12 марта 2019

Я нашел множество решений, которые могут вам помочь.

Вы можете попробовать это:

  1. Создать состояние prevPath

  2. Добавить компонентWillReceiveProps

  3. Предоставить состояние prevPath для parentPath с условием, если prevPath пусто, перенаправить меня по маршруту '/' 

    class App extends Component {
  state = { 
    prevPath: ''
   }

 componentWillReceiveProps(nextProps) {
   if (nextProps.location !== this.props.location) {
     this.setState({ prevPath: this.props.location })
   }
  }

 <ModalRoute
   path="/register"
   parentPath={this.state.prevPath || '/'}
   component={RegisterScreen}
  />

Это одно из решений, которое мы можем попробовать позже, если это не поможет.

...