Página de login separada do aplicativo de página única (SPA) no ReactJS
Estou desenvolvendo um aplicativo de página única (SPA) no ReactJS e gostaria de saber como posso ter a página de login em uma página separada.
estou usandocreate-react-app
como base para o meu aplicativo, e atualmente estou definindo o modelo para o meu SPA noApp.js
e cada componente em um arquivo .js diferente:Page1.js
, Page2.js
etc. estou usandoreact-router-dom
(V ^ 4.2.2) para o roteamento do meu aplicativo.
MinhasApp.js
Arquivo:
//node_modules (using ES6 modules)
import React, { Component } from 'react';
import { BrowserRouter as Router, Route } from 'react-router-dom';
//others
import { Home } from './pages/Home.js';
import { Page1 } from './pages/Page1.js';
import { Page2 } from './pages/Page2.js';
//App variables
const { Content, Footer, Sider } = Layout;
class App extends Component {
render() {
return (
<Router>
<Layout>
<Sider>
//some code
</Sider>
<Layout>
<Header>
//some code
</Header>
<Content>
<Route exact path="/" component={Home}/>
<Route path="/page1" component={Page1}/>
<Route path="/page2" component={Page2}/>
</Content>
<Footer>
//some code
</Footer>
</Layout>
</Layout>
</Router>
);
}
}
export default App;