Skip to content

Commit 6114e6f

Browse files
committed
fix(router-view): fix deeply nested keep-alive router-views displaying
Fix #2923
1 parent 41b9ac8 commit 6114e6f

File tree

3 files changed

+39
-9
lines changed

3 files changed

+39
-9
lines changed

Diff for: examples/keepalive-view/app.js

+24
Original file line numberDiff line numberDiff line change
@@ -27,6 +27,8 @@ const IndexChild2 = { template: '<div>index child2</div>' }
2727

2828
const Home = { template: '<div>home</div>' }
2929

30+
const ViewWithKeepalive = { template: '<keep-alive><router-view></router-view></keep-alive>' }
31+
3032
const router = new VueRouter({
3133
mode: 'history',
3234
base: __dirname,
@@ -58,6 +60,26 @@ const router = new VueRouter({
5860
path: '/with-guard2',
5961
name: 'with-guard2',
6062
component: WithGuard
63+
},
64+
{
65+
path: '/one',
66+
component: ViewWithKeepalive,
67+
children: [
68+
{
69+
path: 'two',
70+
component: ViewWithKeepalive,
71+
children: [
72+
{
73+
path: 'child1',
74+
component: IndexChild1
75+
},
76+
{
77+
path: 'child2',
78+
component: IndexChild2
79+
}
80+
]
81+
}
82+
]
6183
}
6284
]
6385
})
@@ -72,6 +94,8 @@ new Vue({
7294
<li><router-link to="/home">/home</router-link></li>
7395
<li><router-link to="/with-guard1">/with-guard1</router-link></li>
7496
<li><router-link to="/with-guard2">/with-guard2</router-link></li>
97+
<li><router-link to="/one/two/child1">/one/two/child1</router-link></li>
98+
<li><router-link to="/one/two/child2">/one/two/child2</router-link></li>
7599
</ul>
76100
<keep-alive>
77101
<router-view class="view"></router-view>

Diff for: src/components/view.js

+5-8
Original file line numberDiff line numberDiff line change
@@ -26,14 +26,11 @@ export default {
2626
let depth = 0
2727
let inactive = false
2828
while (parent && parent._routerRoot !== parent) {
29-
const vnodeData = parent.$vnode && parent.$vnode.data
30-
if (vnodeData) {
31-
if (vnodeData.routerView) {
32-
depth++
33-
}
34-
if (vnodeData.keepAlive && parent._inactive) {
35-
inactive = true
36-
}
29+
if (parent.$vnode && parent.$vnode.data.routerView) {
30+
depth++
31+
}
32+
if (parent._directInactive && parent._inactive) {
33+
inactive = true
3734
}
3835
parent = parent.$parent
3936
}

Diff for: test/e2e/specs/keepalive-view.js

+10-1
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,7 @@ module.exports = {
99
browser
1010
.url('http://localhost:8080/keepalive-view/')
1111
.waitForElementVisible('#app', 1000)
12-
.assert.count('li a', 5)
12+
.assert.count('li a', 7)
1313

1414
.click('li:nth-child(1) a')
1515
.assert.containsText('.view', 'index child1')
@@ -35,6 +35,15 @@ module.exports = {
3535
.click('li:nth-child(4) a')
3636
.assert.containsText('.view', 'with-guard1: 3')
3737

38+
// keep-alive deeply nested router-views
39+
// https://github.com/vuejs/vue-router/issues/2923
40+
.click('li:nth-child(6) a')
41+
.assert.containsText('.view', 'index child1')
42+
.click('li:nth-child(3) a')
43+
.assert.containsText('.view', 'home')
44+
.click('li:nth-child(7) a')
45+
.assert.containsText('.view', 'index child2')
46+
3847
.end()
3948
}
4049
}

0 commit comments

Comments
 (0)