vndb/mithril-vndb
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Recast key docs to be much clearer and more accurate (#2540)

Browse source 
* Recast key docs to be much clearer and more accurate [skip ci]

Also, fix a couple broken hash links I noticed while making this.

* Ensure `diff` blocks are highlighted correctly
This commit is contained in:
Isiah Meadows 2019-10-11 04:29:11 -04:00 • committed by GitHub
parent d4551f49f5
commit 512eef378e
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
8 changed files with 505 additions and 193 deletions
Download patch file Download diff file Expand all files Collapse all files

6
docs/route.md
View file

@ -283,7 +283,7 @@ Argument | Type | Description
`vnode.attrs` | `Object` | A map of URL parameter values
**returns** | `Array<Vnode>|Vnode` | The [vnodes](vnodes.md) to be rendered
The `vnode` parameter is just `m(Component, m.route.param())` where `Component` is the resolved component for the route (after `routeResolver.onmatch`) and `m.route.param()` is as documented [here](#mrouteparam). If you omit this method, the default return value is `[vnode]`, wrapped in a fragment so you can use [key parameters](#key-parameter). Combined with a `:key` parameter, it becomes a [single-element keyed fragment](keys.md#single-child-keyed-fragments), since it ends up rendering to something like `[m(Component, {key: m.route.param("key"), ...})]`.
The `vnode` parameter is just `m(Component, m.route.param())` where `Component` is the resolved component for the route (after `routeResolver.onmatch`) and `m.route.param()` is as documented [here](#mrouteparam). If you omit this method, the default return value is `[vnode]`, wrapped in a fragment so you can use [key parameters](#key-parameter). Combined with a `:key` parameter, it becomes a [single-element keyed fragment](keys.md#reinitializing-views-with-single-child-keyed-fragments), since it ends up rendering to something like `[m(Component, {key: m.route.param("key"), ...})]`.
---
@ -403,7 +403,7 @@ It's possible to have multiple arguments in a route, for example `/edit/:project
When a user navigates from a parameterized route to the same route with a different parameter (e.g. going from `/page/1` to `/page/2` given a route `/page/:id`, the component would not be recreated from scratch since both routes resolve to the same component, and thus result in a virtual dom in-place diff. This has the side-effect of triggering the `onupdate` hook, rather than `oninit`/`oncreate`. However, it's relatively common for a developer to want to synchronize the recreation of the component to the route change event.
To achieve that, it's possible to combine route parameterization with the virtual dom [key reconciliation](keys.md) feature:
To achieve that, it's possible to combine route parameterization with [keys](#reinitializing-views-with-single-child-keyed-fragments) for a very convenient pattern:
```javascript
m.route(document.body, "/edit/1", {
@ -421,7 +421,7 @@ Or even use the [`history state`](#history-state) feature to achieve reloadable
`m.route.set(m.route.get(), null, {state: {key: Date.now()}})`
Note that the key parameter works only for component routes. If you're using a route resolver, you'll need to use a [single-child keyed fragment](keys.md), passing `key: m.route.param("key")`, to accomplish the same.
Note that the key parameter works only for component routes. If you're using a route resolver, you'll need to use a [single-child keyed fragment](keys.md#reinitializing-views-with-single-child-keyed-fragments), passing `key: m.route.param("key")`, to accomplish the same.
#### Variadic routes