Add children prop feature in <Miss> #4140
Conversation
|
@timdorr Could you help review this PR? |
| const { noMatchesInContext } = this.state | ||
| const { serverRouter, match } = this.context | ||
| const noMatchesOnServerContext = serverRouter && | ||
| serverRouter.missedAtIndex(match.serverRouterIndex) | ||
| if (noMatchesInContext || noMatchesOnServerContext) { | ||
| const matched = !(noMatchesInContext || noMatchesOnServerContext) |
There was a problem hiding this comment.
Is this intentionally negated? It calls children({ matched: false }) when no other matches on context were rendered, making it behave the opposite of Match's children.
There was a problem hiding this comment.
The matched property of children indicates whether it's matched or not, doesn't it? So, when no other matches on context, it should be set to false.
I think the Match's children behaves the same way. If it's matched, the matched property of its children is set to true, otherwise, false.
Please correct me if I understand something wrong.
There was a problem hiding this comment.
The matched passed to Match's children only indicates if that particular Match was matched. If that wasn't the case it wouldn't be very useful. Miss is supposed to "match" when no Matches "matched", so it's inverse. Basically, if it a particular Match or Miss should render stuff then it should set matched to true.
There was a problem hiding this comment.
The idea is that children should let you accomplish the same thing as render, but allowing the user to control what happens when it should or shouldn't render. The example in the docs is for animation, where an animation wrapper needs to always be rendered but it only has children if it's a match.
There was a problem hiding this comment.
(see the example here under "children: func")
There was a problem hiding this comment.
So, when there is no match in context, it means it matches the Miss component and its children know that the parent (Miss) is matched. Got it. Thank you @spicydonuts. Will fix it then.
supasate
force-pushed
the
add-children-prop-feature-in-Miss
branch
from
afde7b0 to
117e259
Compare
supasate
force-pushed
the
add-children-prop-feature-in-Miss
branch
from
117e259 to
072e8b8
Compare
|
Just rebased with the new Miss component |
…ocation and matched props
|
The troublesome |
Fix #4026
Always render a provided children prop for regardless of route matching.