0

My route looks like this:

So naturally, since info messages are on every page and are all the same, they should be called from App. Without routing this would be no problem as I would just pass the function down the chain as prop and call it when needed. However when I am using router this gets complicated. I tried this approach, but map is returning empty array. Also the fact that such functionality is not integrated makes me think there is another approach, but I am unable to find it. So how would you, people with more react experience, do it? 

 <Router history={browserHistory}>
    <Route path="/" component={App}>
        <IndexRoute component={HomeView}/>
        <Route path="/login" component={LoginView}/>
        <Route path="/register" component={RegisterView}/>
        <Route path="/createBook" component={CreateBookView}/>
        <Route path="/listBooks" component={ListBooksView}/>
        <Route path="/listBooks/:bookData" component={EditBookView}/>
    </Route>
</Router>

My message component is as simple as it gets - 2 different selectors for message / error styles and the message info, both coming from props.

Community
  • 1
  • 1
Alex
  • 715
  • 1
  • 8
  • 29
  • Where are the messages coming from? Other route components? Where are messages stored? Internally in the `` or are you using some sort of store like `redux`? – Paul S Dec 10 '16 at 18:11
  • @PaulS My current messages are simple jsx components. My idea is to render them if needed, then they fade out. However I am asking about a general answer. How would you do it? – Alex Dec 11 '16 at 06:37
  • I would probably just use a store like redux or mobx to store messages, and then connect whatever component is rendering the messages to the store to fetch the messages. Any component that might add messages would also be connected to the store to add any new messages. – Paul S Dec 11 '16 at 21:50

0 Answers0