Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

"props" option works differently than explained in the docs when defining multiple components on a route, #1183

Closed
brad426 opened this issue Feb 20, 2017 · 5 comments

Comments

@brad426
Copy link

brad426 commented Feb 20, 2017

Given a route entry like this:

{
  path: '/path/:test_prop',
  components: {
    default: Bar,
    a: Foo
  },
  props: true
}

Neither component Foo or Bar will receive the test_prop prop

Working example of issue https://jsfiddle.net/6du90epg/231/

@LinusBorg
Copy link
Member

LinusBorg commented Feb 22, 2017

I think this is "only" a problem of lacking documentation.

Looking at the source here and here, it's clear that the intended usage with multiple components is this:

 {
  path: '/multiple/:test_prop',
  components: {
    default: Bar,
    a: Foo
  },
  props: {
    default: true,
    a: (route) => ({ test_prop: route.params.test_prop })
  }
}

With that, it works as intended: https://jsfiddle.net/Linusborg/6du90epg/237/

And this makes sense, because in most scenarios, each component will/might need a different set of props.

@brad426
Copy link
Author

brad426 commented Feb 22, 2017

Yup, that works perfectly. Thank you.

@brad426 brad426 closed this as completed Feb 22, 2017
@LinusBorg LinusBorg reopened this Feb 22, 2017
@LinusBorg
Copy link
Member

LinusBorg commented Feb 22, 2017

Re-opened because we still have to track improvement of docs here. ;)

@LinusBorg LinusBorg changed the title When defining components (with an 's') on a route, props are never passed to the components When defining components (with an 's') on a route, "props" option works differently than explained in the docs Feb 22, 2017
@LinusBorg LinusBorg changed the title When defining components (with an 's') on a route, "props" option works differently than explained in the docs "props" option works differently than explained in the docs when defining multiple components on a route, Feb 22, 2017
@LinusBorg
Copy link
Member

merged imrpoved docs section, have to republish again tonight, though.

@LinusBorg LinusBorg reopened this Feb 23, 2017
@LinusBorg LinusBorg self-assigned this Feb 23, 2017
@veonua
Copy link

veonua commented Dec 28, 2018

{
      path: '/a',
      components: {
        default: Reader,
        toolbar: ReaderToolbar
      },
      props: { 
        default : (route) => ({ url: route.query.u, card_ref: route.query.r }), 
        toolbar : (route) => ({ url: route.query.u, card_ref: route.query.r })
      } 
    }

ReaderToolbar got no props

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

5 participants