Перезагрузка или ввод URL-адреса вручную всегда перенаправить на root

Название говорит само за себя.

Когда я вручную набираю URL в браузере или пытаюсь обновить, он всегда возвращается к корню, что-то не так? потому что я не понимаю

Когда я обновляю или набираю url вручную, и я захожу, он переходит на панель инструментов, а когда я не захожу, он переходит на страницу входа.

Вот мой код

 import { Switch, Route, Redirect, Router } from 'react-router-dom';

 <Provider store={this.props.store}>
    <IntlProvider locale={this.props.locale} messages={this.props.localeData}>
      <LocaleProvider locale={enUS}>
        <Router history={history}>
          <Switch>
            <Route exact path="/" render={() => (<Redirect to="/dashboard" />)} />
            <PrivateRoute path="/dashboard" component={App} locale={this.props.locale} redirectTo="/login" />
            <PropsRoute path="/login" component={Login} />
            <PropsRoute path="/reset-password" component={ResetPassword} />
            <PropsRoute path="/loader" component={Loader} spinning={true} fullScreen={true} />
            <Route component={NoMatch} />
          </Switch>
        </Router>
      </LocaleProvider>
    </IntlProvider>
  </Provider>

это мой реквизит

const renderMergedProps = (component, ...rest) => {
  const finalProps = Object.assign({}, ...rest);
  return (
    React.createElement(component, finalProps)
  );
};

const PropsRoute = ({ component, ...rest }) => {
  return (
    <Route {...rest} render={routeProps => {
      return renderMergedProps(component, routeProps, rest);
    }} />
  );
};

и мой личный маршрут

const PrivateRoute = ({ user, component, redirectTo, ...rest }) => {
  return (
    <Route {...rest} render={routeProps => {
      return user.logged ? (
        renderMergedProps(component, routeProps, rest)
      ) : (
          <Redirect to={{
            pathname: redirectTo,
            state: { from: routeProps.location }
          }} />
        );
    }} />
  );
};

Примечание: я также использую Redux и Redux Saga.

1 ответ

const PrivateRoute = ({ user, component, redirectTo, ...rest }) => {
  return (
    <Route {...rest} render={routeProps => {
      return user.logged ? (
        renderMergedProps(component, routeProps, rest)
      ) : (
          <Redirect to={{
            pathname: redirectTo,
            state: { from: routeProps.location }
          }} />
        );
    }} />
  );
};

Сказал бы, что вы должны проверить, не изменился ли ваш user.logged, это может быть в том случае, если вы перерисовываете приложение, когда вы вручную меняете URL. Вы можете использовать localstorage, чтобы проверить, действительно ли пользователь вошел в систему или нет.

Другие вопросы по тегам