Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Routing in ReactJS

Can anyone explain to me how Routing works in Reactjs?

browserHistory.push('/location')

only updates the URL bar and doesn't redirect to it.

browserHistory.goBack()

works but only when the page has been visited before, hence the name. Which makes it difficult for me to understand how browserHitory.goForward() works?

I have been trying to redirect to dashboard after a successful login. That's it.

From what I have read, React does not allow reloading a page. It will show a cannot GET /path error if we try to refresh the page or write the address in the url; unless the request is made on the server. I tried to create routes on server, but cannot get the syntax as to how I achieve it. I have only coded in Node to the extent of sending res.send() to the client app. How do I render that path? Because rendering to that path would mean that the Node's App.js has the view engine of the React app. I don't know if it's clear enough, but any advice would be helpful. Thanks.

like image 248
Amrita Sharma Avatar asked Apr 30 '17 18:04

Amrita Sharma


1 Answers

first of all define all urls in router that is You can watch these two videos for complete routing part1 part2

You forgot to add use browserHistory.replace('/location') another thing is that dont include / in child routes for example use like this <Route path='submissions' component={Submissions} />

export default ( <Router history={browserHistory}> 
<Route component={App}> 
<Route path='/' component={Home} /> 
<Route path='/submissions' component={Submissions} />
<Route path='/location' component={Location} /> 
<Route path='/login' component={Login} /> 
<Route path='/dashboard' component={Member} /> 
</Route> </Router> );
like image 160
Naveed Aheer Avatar answered Oct 04 '22 03:10

Naveed Aheer