docs: add example of nested named routes #1931
Merged
Conversation
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Akryum
reviewed
Dec 8, 2017
docs/en/essentials/named-views.md
Outdated
| </div> | ||
| ``` | ||
|
|
||
| _The nested view components are omitted here but you can find the full example at the end in the jsfiddle_ |
There was a problem hiding this comment.
It's unfortunate that the jsfiddle link is at the end. Reader may ask "what jsfiddle?" here.
Maybe add the link here too?
znck
reviewed
Dec 8, 2017
docs/en/essentials/named-views.md
Outdated
|
|
||
| ``` | ||
| /settings/emails /settings/profile | ||
| +-----------------------------------+ +------------------------------+ |
There was a problem hiding this comment.
Let's keep this for the moment. An Image would be indeed better
docs/en/essentials/named-views.md
Outdated
|
|
||
| ## Nested Named Views | ||
|
|
||
| While being quite complex, it is possible to combine named views with nested view. When doing so, you will also need to name nested `router-view` components used. Let's take a Settings panel example: |
There was a problem hiding this comment.
Re-wording.
It is possible to create complex layouts using named views with nested views. For example, let us see following example; a settings panel.
| - `UserSettings` is the view comopnent | ||
| - `UserEmailsSubscriptions`, `UserProfile`, `UserProfilePreview` are nested view components | ||
|
|
||
| **Note**: _Let's forget about how the HTML/CSS should look like to represent such layout and focus on the components used_ |
There was a problem hiding this comment.
Re-wording.
The <template> section for UserSettings component in above layout would be something like this:
docs/en/essentials/named-views.md
Outdated
| </div> | ||
| ``` | ||
|
|
||
| _The nested view components are omitted here but you can find the full example [here](https://jsfiddle.net/posva/22wgksa3/)_ |
There was a problem hiding this comment.
Re-wording.
You can find the complete source code for above example here.
|
@znck Thanks! I updated the relevant parts the best I could |
znck
approved these changes
Dec 12, 2017
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Closes #1921