Accessing a url parameter to use in a query using react-router-relay

Question

I am using react-router and react-router-relay to handle routing on my app. I am having a problem trying to access the id param that is passed in the url path. What is the correct way to do this?

routes.js

import CreativeQuery from './CreativeQuery';

<Route path='/creative' component={CreativeComponent} queries={ViewerQuery}>
<Route path="/creative/edit/:id" component={CreativeEditComponent} queries={CreativeQuery}/>

CreativeQuery.js

import Relay from 'react-relay';

export default {
  creative: (Component) => Relay.QL`
    query {
      creative(id:$id) { #<--- id from the url param
        ${Component.getFragment('creative')}
      }
    }
  `
};

Answer 1

It should be as simple as this:

import Relay from 'react-relay';

export default {
  creative: () => Relay.QL`query { creative(id: $id)  }`
};

You can then access the id via this.props of your component.