Problems with routing

[aprilmintacpineda]

I have this code

import React from 'react';
import { render } from 'react-dom';
import { Provider } from 'react-redux';
import {
	Router,
	Route,
	browserHistory,
	IndexRoute
} from 'react-router';

import Main from './components/Main';

import Login from './containers/Login';
import Register from './containers/Register';
import Home from './containers/Home';
import Product from './containers/Product';

import store from './store';

render(
	<Provider store={store}>
		<Router history={browserHistory}>
			<Route path="/" component={Main}>
				<IndexRoute component={Home} />
				<Route path="home" component={Home} />
				<Route path="login" component={Login} />
				<Route path="register" component={Register} />
				<Route path="products/:id" component={Product} />
			</Route>
		</Router>
	</Provider>,
	document.getElementById('app')
);

then a top bar where all the clickable <Link>s are, if I go to localhost:8000/login, I get no problem, the same goes with the register and the home and the products, in short they all render just fine. The problem starts if I go the localhost:8000/products/3 which is suppose to show details about the product with id of 3 then you go back to home and the url will become localhost:8000/products/3. From localhost:8000/products if you click login it will become localhost:8000/products/login and same goes for the other links, if you are in home and you clicked a product which will actually take you to products/:id route it would become even messier: localhost/products/products/3. But throughout all this the components are rendering just fine! what seems to be the problem?

[sdymj84]

I have the same problem here. Can anyone tell me what's wrong?

[sdymj84]

I just figured out that it was because I and the OP used path without "/"
it should be <Route path="/home" component={Home} />
and OP didn't put the code here but when redirecting, it should be <Link to="/home"> instead of <Link to="home">
this Link without / is the main reason that causes this issue