fixed routing

4.x.x
Jayasanka 6 years ago
parent b3d87186eb
commit 9a580e513f

@ -3,27 +3,33 @@ import "antd/dist/antd.css";
import RouteWithSubRoutes from "./components/RouteWithSubRoutes"; import RouteWithSubRoutes from "./components/RouteWithSubRoutes";
import { import {
BrowserRouter as Router, BrowserRouter as Router,
Link, Link, Redirect, Switch,
} from 'react-router-dom'; } from 'react-router-dom';
class App extends React.Component { class App extends React.Component {
routes; routes;
constructor(props) { constructor(props) {
super(props); super(props);
this.routes = props.routes; this.routes = props.routes;
} }
render() {
return (
<Router>
<div>
{this.routes.map((route) => (
<RouteWithSubRoutes key={route.path} {...route} />
))}
</div>
</Router>
); render() {
} console.log(this.routes);
return (
<Router>
<div>
<Switch>
<Redirect exact from="/publisher" to="/publisher/dashboard/apps"/>
{this.routes.map((route) => (
<RouteWithSubRoutes key={route.path} {...route} />
))}
</Switch>
</div>
</Router>
);
}
} }
export default App; export default App;

@ -8,7 +8,7 @@ class RouteWithSubRoutes extends React.Component{
} }
render() { render() {
return( return(
<Route path={this.props.path} render={(props) => ( <Route path={this.props.path} exact={this.props.exact} render={(props) => (
<this.props.component {...props} routes={this.props.routes}/> <this.props.component {...props} routes={this.props.routes}/>
)}/> )}/>
); );

@ -9,24 +9,29 @@ import AddNewApp from "./pages/dashboard/add-new-app/AddNewApp";
import './index.css'; import './index.css';
import store from "./js/store/index"; import store from "./js/store/index";
import {Provider} from "react-redux"; import {Provider} from "react-redux";
import {Switch} from "react-router";
const routes = [ const routes = [
{ {
path: '/publisher/login', path: '/publisher/login',
exact: true,
component: Login component: Login
}, },
{ {
path: '/publisher', path: '/publisher/dashboard',
exact: false,
component: Dashboard, component: Dashboard,
routes: [ routes: [
{ {
path: '/publisher/apps', path: '/publisher/dashboard/apps',
component: Apps component: Apps,
exact: false
}, },
{ {
path: '/publisher/new-app', path: '/publisher/dashboard/new-app',
component: AddNewApp component: AddNewApp,
exact: false
} }
] ]
} }
@ -35,7 +40,7 @@ const routes = [
ReactDOM.render( ReactDOM.render(
<Provider store={store}> <Provider store={store}>
<App routes={routes}/> <App routes={routes}/>
</Provider>, </Provider>,
document.getElementById('root')); document.getElementById('root'));

@ -38,7 +38,7 @@ class Dashboard extends React.Component {
</Header> </Header>
<Content style={{padding: '0 0'}}> <Content style={{padding: '0 0'}}>
<Switch> <Switch>
<Redirect exact from="/publisher" to="/publisher/apps"/> <Redirect exact from="/publisher/dashboard" to="/publisher/dashboard/apps"/>
{this.state.routes.map((route) => ( {this.state.routes.map((route) => (
<RouteWithSubRoutes key={route.path} {...route} /> <RouteWithSubRoutes key={route.path} {...route} />
))} ))}

Loading…
Cancel
Save