You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
In the repro, there are two nested components: Bar -> Foo.
They both have props: true and both components have an id prop.
Because the :id route parameter is at the 2nd level, I would not expect it to "bleed" on the higher level.
This is opposite of regular dataflow and can cause unexpected issues if your top component has these props for other uses in another context.
This creates a brittle base problem. Adding a new prop in the child component can break its parent if the same props existed there.
What is expected?
props defined in nested routes shouldn't be set on parent component.
What is actually happening?
they are.
I am not really set on whether the opposite should happen or not (a parent route prop being set on a child component).
I suppose that could be understandable as it's the regular dataflow direction? Or not? Or maybe make it an explicit option?
Maybe all options are ok.
The text was updated successfully, but these errors were encountered:
yeah, this is intended. props: true is the convenient pass-all option. You can use a function instead to selectively pass anything you want or even use the v-slot API to pass props.
This creates a brittle base problem. Adding a new prop in the child component can break its parent if the same props existed there.
This is true with regular components but not wih page components because they are used in very specific scenarios and most of the time they are only passed to routes.
Although the docs explicitly say that props exists to enable their re-use as views and regular component in app.
I agree it's pretty rare. Threw me off for a while though.
(I was also thrown off for a while by the fact that router-view doesn't provide you with your route but a kind of global route object with path being the full matched url. You have to fish into matched[] array but if you consider a structure with multiple nesting levels, it's pretty hard to know which level you're at. Let me know if you want me to open an issue for improvements there.)
Version
4.0.12
Reproduction link
jsfiddle.net/k8z1vp4b/
Steps to reproduce
In the repro, there are two nested components: Bar -> Foo.
They both have
props: true
and both components have anid
prop.Because the
:id
route parameter is at the 2nd level, I would not expect it to "bleed" on the higher level.This is opposite of regular dataflow and can cause unexpected issues if your top component has these props for other uses in another context.
This creates a brittle base problem. Adding a new prop in the child component can break its parent if the same props existed there.
What is expected?
props defined in nested routes shouldn't be set on parent component.
What is actually happening?
they are.
I am not really set on whether the opposite should happen or not (a parent route prop being set on a child component).
I suppose that could be understandable as it's the regular dataflow direction? Or not? Or maybe make it an explicit option?
Maybe all options are ok.
The text was updated successfully, but these errors were encountered: