import { routesArray } from './routerArray'
import {renderRoutes, matchRoutes} from 'react-router-config';
import {HashRouter} from 'react-router-dom';
function App() {
return(<HashRouter>
{renderRoutes(routesArray)}
</HashRouter>);
}
export default App;
import FirstLayout from '../page/FirstLayout'
import SecondLayout from '../page/SecondLayout'
import ThirdLayout from '../page/ThirdLayout'
const routesArray = [
{
path : "/",
component : FirstLayout,
routes : [
{
path : "secondLayout",
component : SecondLayout,
routes : [
{
path : "ThirdLayout",
component : ThirdLayout,
}
]
}
]
}
]
export default routesArray ;
import {renderRoutes, matchRoutes} from 'react-router-config';
import {Link} from 'react-router-dom';
let FirstLayout = (props)=>{
return(<div>
<Link to="/secondLayout"></Link>
{renderRoutes(props.route.routes)}
</div>);
}
import {renderRoutes, matchRoutes} from 'react-router-config';
import {Link} from 'react-router-dom';
let SecondLayout = (props)=>{
return(<div>
<Link to="/secondLayout"></Link>
{renderRoutes(props.route.routes)}
</div>);
}
import {renderRoutes, matchRoutes} from 'react-router-config';
let ThirdLayout = (props)=>{
return(<div>
thirdLayout
</div>);
}