diff --git a/lib/app/client.js b/lib/app/client.js index a289c9f8d2..183ee91d04 100644 --- a/lib/app/client.js +++ b/lib/app/client.js @@ -204,7 +204,8 @@ async function render (to, from, next) { <% if(loading) { %>if (from.path !== path.path && this.$loading.pause) this.$loading.pause()<% } %> if (nextCalled) return nextCalled = true - _lastPaths = getMatchedComponents(from).map((Component, i) => compile(from.matched[i].path)(from.params)) + const matches = [] + _lastPaths = getMatchedComponents(from, matches).map((Component, i) => compile(from.matched[matches[i]].path)(from.params)) next(path) } @@ -218,7 +219,8 @@ async function render (to, from, next) { this._hadError = !!app.nuxt.err // Get route's matched components - const Components = getMatchedComponents(to) + const matches = [] + const Components = getMatchedComponents(to, matches) // If no Components matched, generate 404 if (!Components.length) { @@ -283,7 +285,7 @@ async function render (to, from, next) { // Call asyncData & fetch hooks on components matched by the route. await Promise.all(Components.map((Component, i) => { // Check if only children route changed - Component._path = compile(to.matched[i].path)(to.params) + Component._path = compile(to.matched[matches[i]].path)(to.params) Component._dataRefresh = false // Check if Component need to be refreshed (call asyncData & fetch) // Only if its slug has changed or is watch query changes @@ -335,7 +337,7 @@ async function render (to, from, next) { // If not redirected if (!nextCalled) { <% if (loading) { %>if(this.$loading.finish) this.$loading.finish()<% } %> - _lastPaths = Components.map((Component, i) => compile(to.matched[i].path)(to.params)) + _lastPaths = Components.map((Component, i) => compile(to.matched[matches[i]].path)(to.params)) next() } @@ -390,11 +392,12 @@ function fixPrepatch(to, ___) { if (this._pathChanged === false && this._queryChanged === false) return Vue.nextTick(() => { - const instances = getMatchedComponentsInstances(to) + const matches = [] + const instances = getMatchedComponentsInstances(to, matches) instances.forEach((instance, i) => { if (!instance) return - if (to.matched[i].path.indexOf(':') === -1) return // If not a dyanmic route, skip + if (to.matched[matches[i]].path.indexOf(':') === -1) return // If not a dyanmic route, skip if (instance.constructor._dataRefresh && _lastPaths[i] === instance.constructor._path && typeof instance.constructor.options.data === 'function') { const newData = instance.constructor.options.data.call(instance) for (let key in newData) { diff --git a/lib/app/utils.js b/lib/app/utils.js index c983624150..f90876156a 100644 --- a/lib/app/utils.js +++ b/lib/app/utils.js @@ -49,17 +49,19 @@ export function sanitizeComponent(Component) { return Component } -export function getMatchedComponents(route) { - return [].concat.apply([], route.matched.map(function (m) { +export function getMatchedComponents(route, matches = false) { + return [].concat.apply([], route.matched.map(function (m, index) { return Object.keys(m.components).map(function (key) { + matches && matches.push(index) return m.components[key] }) })) } -export function getMatchedComponentsInstances(route) { - return [].concat.apply([], route.matched.map(function (m) { +export function getMatchedComponentsInstances(route, matches = false) { + return [].concat.apply([], route.matched.map(function (m, index) { return Object.keys(m.instances).map(function (key) { + matches && matches.push(index) return m.instances[key] }) }))