From 0bcc34efa7353b9cbcffee82bf88678a60601f66 Mon Sep 17 00:00:00 2001 From: zrh122 <1229550935@qq.com> Date: Tue, 22 Jan 2019 16:24:27 +0800 Subject: [PATCH 1/2] fix(router-view): add condition to see whether the tree is inactive close #2552 --- src/components/view.js | 13 ++++++++----- 1 file changed, 8 insertions(+), 5 deletions(-) diff --git a/src/components/view.js b/src/components/view.js index f6183a0f4..a3c8a0319 100644 --- a/src/components/view.js +++ b/src/components/view.js @@ -26,11 +26,14 @@ export default { let depth = 0 let inactive = false while (parent && parent._routerRoot !== parent) { - if (parent.$vnode && parent.$vnode.data.routerView) { - depth++ - } - if (parent._inactive) { - inactive = true + const vnodeData = parent.$vnode && parent.$vnode.data + if (vnodeData) { + if (vnodeData.routerView) { + depth++ + } + if (vnodeData.keepAlive && parent._inactive) { + inactive = true + } } parent = parent.$parent } From 10346f37c6eac4db511bb5d9f59659218361a773 Mon Sep 17 00:00:00 2001 From: zrh122 <1229550935@qq.com> Date: Wed, 23 Jan 2019 00:07:41 +0800 Subject: [PATCH 2/2] test: add e2e test for #2552 --- examples/index.html | 1 + examples/keepalive-view/app.js | 59 ++++++++++++++++++++++++++++++ examples/keepalive-view/index.html | 14 +++++++ test/e2e/specs/keepalive-view.js | 22 +++++++++++ 4 files changed, 96 insertions(+) create mode 100644 examples/keepalive-view/app.js create mode 100644 examples/keepalive-view/index.html create mode 100644 test/e2e/specs/keepalive-view.js diff --git a/examples/index.html b/examples/index.html index f2bdf7225..9fcb249da 100644 --- a/examples/index.html +++ b/examples/index.html @@ -25,6 +25,7 @@

Vue Router Examples

  • Auth Flow
  • Discrete Components
  • Nested Routers
    • +
  • Keepalive View
    • diff --git a/examples/keepalive-view/app.js b/examples/keepalive-view/app.js new file mode 100644 index 000000000..e158f5fb8 --- /dev/null +++ b/examples/keepalive-view/app.js @@ -0,0 +1,59 @@ +import Vue from 'vue' +import VueRouter from 'vue-router' + +Vue.use(VueRouter) + +const Wrap = { template: '
    child:
    ' } + +const Index = { + template: '', + components: { + Wrap + } +} + +const IndexChild1 = { template: '
    index child1
    ' } +const IndexChild2 = { template: '
    index child2
    ' } + +const Home = { template: '
    home
    ' } + +const router = new VueRouter({ + mode: 'history', + base: __dirname, + routes: [ + { + path: '/index', + component: Index, + children: [ + { + path: 'child1', + component: IndexChild1 + }, + { + path: 'child2', + component: IndexChild2 + } + ] + }, + { + path: '/home', + component: Home + } + ] +}) + +new Vue({ + router, + template: ` +
    + + + + +
    + ` +}).$mount('#app') diff --git a/examples/keepalive-view/index.html b/examples/keepalive-view/index.html new file mode 100644 index 000000000..2781935a4 --- /dev/null +++ b/examples/keepalive-view/index.html @@ -0,0 +1,14 @@ + + + +← Examples index +
    + + diff --git a/test/e2e/specs/keepalive-view.js b/test/e2e/specs/keepalive-view.js new file mode 100644 index 000000000..7e68ada41 --- /dev/null +++ b/test/e2e/specs/keepalive-view.js @@ -0,0 +1,22 @@ +module.exports = { + 'keepalive view': function (browser) { + browser + .url('http://localhost:8080/keepalive-view/') + .waitForElementVisible('#app', 1000) + .assert.count('li a', 3) + + .click('li:nth-child(1) a') + .assert.containsText('.current', 'index child1') + + .click('li:nth-child(2) a') + .assert.containsText('.current', 'index child2') + + .click('li:nth-child(3) a') + .assert.containsText('.current', 'home') + + // back to index child1 and check it + .click('li:nth-child(1) a') + .assert.containsText('.current', 'index child1') + .end() + } +}