Description
Version
2.4.0
Reproduction link
http://jsfiddle.net/lehni/Lb0hz1b0/
Steps to reproduce
Click on any of the two router links in the linked example. In the first view, you will see that a reference to the default view instance is defined.
What is expected?
I expect the instances reference to always point to the mapped router view component instances.
What is actually happening?
After navigating to the second link, the reference is gone, although the view component is reused.
I noticed this because I am using the meta field to attach data to routes that are auto-generated from an admin editor schema description described in JavaScript object literals, out of which the full admin is built automatically. I needed a way to retrieve these meta fields in the associated instances of my router view components, and the only way I found to work was:
computed: {
routeRecord() {
for (let route of this.$route.matched) {
const instances = route.instances
for (let name in instances) {
if (this === instances[name]) {
return route
}
}
}
return null
},
isLastRoute() {
// Returns true when this router component is the last one in the route.
const matched = this.$route.matched
return this.routeRecord === matched[matched.length - 1]
},
meta() {
const record = this.routeRecord
return record ? record.meta : null
}
}But the route record object loosing the references to the instances breaks this.
It would be nice to have a $meta and $routeRecord property available that link the router view component instances to the associated route record and attached meta data.
Another scenario where I needed this is the isLastRoute property that you can see above, to know if my template needs to provide another router-view or wether it can render its own content, facilitating automatic nesting based on the schema.