Skip to content

Commit 6974a6f

Browse files
authored
fix: push before creating Vue instance (#2713)
Fix #2712
1 parent a0c1c5e commit 6974a6f

File tree

4 files changed

+59
-1
lines changed

4 files changed

+59
-1
lines changed
+39
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,39 @@
1+
import Vue from 'vue'
2+
import VueRouter from 'vue-router'
3+
4+
Vue.use(VueRouter)
5+
6+
const Home = { template: '<div>Home</div>' }
7+
const Foo = () =>
8+
new Promise(resolve => {
9+
setTimeout(() =>
10+
resolve({
11+
template: `<div class="foo">This is Foo</div>`
12+
})
13+
, 10)
14+
})
15+
16+
const router = new VueRouter({
17+
mode: 'history',
18+
base: __dirname,
19+
routes: [
20+
{ path: '/', component: Home },
21+
// Just use them normally in the route config
22+
{ path: '/async', component: Foo }
23+
]
24+
})
25+
26+
router.push('/async')
27+
28+
document.getElementById('load-button').addEventListener('click', (event) => {
29+
new Vue({
30+
router,
31+
template: `
32+
<div id="app">
33+
<h1>Async</h1>
34+
<router-view class="view"></router-view>
35+
</div>
36+
`
37+
}).$mount('#app')
38+
event.target.remove()
39+
})
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
<!DOCTYPE html>
2+
<link rel="stylesheet" href="/global.css">
3+
<a href="/">&larr; Examples index</a>
4+
<div id="app"></div>
5+
6+
<button id="load-button">Load</button>
7+
<script src="/__build__/shared.chunk.js"></script>
8+
<script src="/__build__/lazy-loading-before-mount.js"></script>

src/util/resolve-components.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -30,7 +30,7 @@ export function resolveAsyncComponents (matched: Array<RouteRecord>): Function {
3030
match.components[key] = resolvedDef
3131
pending--
3232
if (pending <= 0) {
33-
next()
33+
next(to)
3434
}
3535
})
3636

Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
module.exports = {
2+
'lazy loading before mount': function (browser) {
3+
browser
4+
.url('http://localhost:8080/lazy-loading-before-mount/')
5+
// wait for the Foo component to be resolved
6+
.click('#load-button')
7+
.waitForElementVisible('.foo', 1000)
8+
.assert.containsText('.view', 'This is Foo')
9+
.end()
10+
}
11+
}

0 commit comments

Comments
 (0)