Я использую реагировать и реагировать маршрутизатор v4 для маршрутизации. Я создал PrivateRoutes для аутентификации и, поскольку я их реализовал, я не могу использовать Error route для несоответствия.
Ошибка route работает каждый раз, когда я попадаю на неправильную страницу, но проблема в том, что она отображается каждый раз для любого маршрута.
Я пытался создать обычную страницу, но каждая открытая страница сначала отрисовывается, а затем после этого я вижу, что так и должно быть
const Error = () => {
console.log('error showing');
return (
<div>
<p>Error: Route doesn't exist</p>
</div>
);
};
const PrivateRoute = ({ component: Component, token, error, ...rest }) => (
<Route
{...rest}
render={props => (
token !== '' ? <Component {...props} /> : <Redirect to="/login" />
)}
/>
);
render() {
return (
<BrowserRouter>
<Switch>
<Route path="/login" component={Login} />
<Route path="/signup" component={Signup} />
<Layout>
<PrivateRoute path="/" component={Home} exact token={this.props.login.token} />
<PrivateRoute path="/upload" component={Upload} exact token={this.props.login.token} />
<PrivateRoute path="/certificates" component={Certs} exact token={this.props.login.token} />
<Route component={Error} />
<PrivateRoute path="/transactions" component={Tables} exact token={this.props.login.token} />
<PrivateRoute path="/issue" component={Issue} token={this.props.login.token} />
<Route component={Error}/>
</Layout>
</Switch>
</BrowserRouter>
);
}
}