Реакция - опора маршрута компонента - опора маршрута деда - PullRequest
Новая
       8

Реакция - опора маршрута компонента - опора маршрута деда

0 голосов
/ 14 сентября 2018

У меня странное поведение.Я использую реагировать 15.6.1 и реагировать-маршрутизатор 3.0.5.У меня нет возможности для обновления на данный момент.У меня есть следующие маршруты, настроенные в index.js: 

  render(
    <ApolloProvider store={store} client={graphQLClient}>
      <ConnectedIntlProvider>
        <ThemeProvider theme={defaultTheme}>
          <Router history={history}>
            <Route
              name="Home"
              path="/"
              component={App}
              onEnter={authRequired}
            >
              <Route path="customer/:id" component={CustomerHome}>
                <Route name="Settings" path="settings" component={CustomerSettings}>
                  <IndexRoute
                    name="Edit"
                    component={EditPage}
                  />
                  <Route
                    name="Sales"
                    path="sales"
                    component={CustomerSales}
                  />
                  <Route
                    name="Favorites"
                    path="favorites"
                    component={ManageFavorites}
                  />
                  <Route
                    name="Setup"
                    path="setup"
                    component={CustomerSetup}
                  />
               </Route>
             </Route>
           </Router>
         </ThemeProvider>
       </ConnectedIntlProvider>
     </ApolloProvider>,
    document.getElementById('react-root')
  )

Мне нужно использовать страницу router.setRouteLeaveHook на ManageFlected , поэтому я обернул ее withRouter.Это место, где я установил хук: 

  componentDidMount() {
    console.log(this.props.route)     
    this.props.router.setRouteLeaveHook(this.props.route, () => {
      if (this.state.isEditing) {
        return "Are you sure you want to navigate away?"
      }
    }) 
  }

Хук не работает, потому что объект this.props.route все еще имеет свойства деда, то есть страницу CustomerHome .Это свойство path равно, например, customer/:id.Поэтому хук установлен на CustomerHome , а не на ManageFabilities .

Я могу использовать свойства childRoutes, чтобы найти свой компонент через индексы, но это действительно такплохое решение.Обычно я ожидаю, что у объекта this.props.route есть текущие свойства маршрута компонентов, а не у дедушки.

Я включил constructor(props) { super(props); } в ManageFolated , CustomerSettings и CustomerHome страниц, но это также не имело никакого значения.

У меня закончились идеи, есть ли у вас какие-либо идеи, почему this.props.route не работает должным образом?

...