erikras / react-redux-universal-hot-example

A starter boilerplate for a universal webapp using express, react, redux, webpack, and react-transform
MIT License
11.99k stars 2.5k forks source link

How to create dynamic routes on the basis of json data in universal boilerplate #984

Open Dt-dev28 opened 8 years ago

Dt-dev28 commented 8 years ago

Hello erikras

I am quite a beginner in terms of following the react redux boilerplate. hats off for your amazing efforts..

I really need suggestions on handling dynamic routing

Lets take a simple scenario.. In routes.js

<Route path="about" component={About}/> <Route path="login" component={Login}/> <Route path="survey" component={Survey}/> <Route path="widgets" component={Widgets}/>

data.js

export const data = [
  {id: 1, property: 'Dashboard', link: '/'},
  {id: 2, property: 'Login', link: '/login'},
  {id: 3, property: 'About Us', link: '/About'},
];

now, let say on the basis of user role, the properties in json data will change

let say new property: is

{id: 4, property: 'test page', link: '/test'}

The problem lies . when react will render the components, how it would know the route link .. as it is not defined in the routes.js

I know it seems stupid of me to ask such thing, but i am not getting the right way to implement it

can anyone please suggest some proper way to deal with this case, as i think this scenario is very common in CMS Development, we need a sidebar made of specific menu content as per the user role .

Let say we are building a reservation system , there can be different user roles like admin, maintenance mode, assistant role .

So different role will have different properties, accordingly we need to generate the menu on the basis it, as the properties will definitely differ as per user role.

I am getting insane, as i really want to implement it in a cleaner way within the erik's universal bolierplate .

Help Please

Thanks!!

PS: I am really stuck here., jst a basic scenario can be of great help to me. :).

thedgbrt commented 8 years ago

+1

SuchetaDas commented 6 years ago

+1

Hari-aN commented 5 years ago

same Problem...Please help.

ANG95 commented 5 years ago

+1

Hari-aN commented 5 years ago

Hope ,this may help someone to get start with. Demo:::>>> https://haribhai.github.io/react-router/

Repo:::>>> https://github.com/haribhai/react-router

DavidZah commented 5 years ago

+1