How to refer state in link on react-router

Question

I use a router like this:

render((
  <Router history={browserHistory}>
    <Route path="/" component={App}>
      <IndexRoute component={Home}/>
      <Route path="/detail/:blogId" component={DetailView}/>
    </Route>
  </Router>
), document.getElementById('app'))

and in blog.js I use Link

<Link to={{ pathname: "/detail", query: { blogId: this.props.id } }}>Detail</Link>

but it didn't work, how to replace the :blogId part with state or props?

Answer 1

:blogId is a param, not a query.

You can simply set your param in the link tag like this:

<Link to={'/detail/' + this.props.id}>Detail</Link>

Answer 2

Just write Var link= "detail/" + this.props.id;

Detail