Gatsby: Passing data between components

[thebetterjort]

I'm trying to pass data that I'm getting from a 3rd party API using Link, but fail because

Warning: Unknown prop `user` on <a> tag. Remove this prop from the element. For details, see https://fb.me/react-unknown-prop
    in a (created by Link)
    in Link (created by GatsbyLink)
    in GatsbyLink (at new-project.js:20)
    in div (at new-project.js:30)
    in div (at new-project.js:28)
    in div (at new-project.js:25)
    in NewProject (created by ComponentRenderer)
    in ComponentRenderer (created by Route)
    in Route (created by Layout)
    in div (at index.js:17)
    in div (at index.js:8)
    in Layout (at index.js:6)
    in _default (created by ComponentRenderer)
    in ComponentRenderer (created by Route)
    in Route (created by withRouter(ComponentRenderer))
    in withRouter(ComponentRenderer) (created by Root)
    in ScrollContext (created by Route)
    in Route (created by withRouter(ScrollContext))
    in withRouter(ScrollContext) (created by Root)
    in Router (at root.js:145)
    in DefaultRouter (created by Root)
    in Root (at app.js:64)
    in AppContainer (at app.js:63)

Which means that I can't use the Link to pass data.

I know there has to be an easy way of passing data to a react component, but I can't figure out how if I don't use the Link component?

I'm trying to pass the selected option to another page? I'm missing something here.

````
render() {
const { selectedOption } = this.state
const data = this.props.data
const renderLink = selectedOption ? (
Next Step

) : null

````

[m-allanson]

Gatsby Link wraps React Router's Link, so you should be able to do something like:

<Link to={{
  pathname: '/create/project-title',
  state: { user: this.state.selectedOption }
}}>

[thebarty]

Or maybe use a global store like https://github.com/gatsbyjs/gatsby/issues/5063