8000 Restructure page routing logic, as discussed in #11 · galaxyblur/nativescript-vue@837906d · GitHub
[go: up one dir, main page]

Skip to content

Commit 837906d

Browse files
committed
Restructure page routing logic, as discussed in nativescript-vue#11
1 parent 5618434 commit 837906d

File tree

2 files changed

+90
-58
lines changed

2 files changed

+90
-58
lines changed

platform/nativescript/router-plugin.js

Lines changed: 89 additions & 40 deletions
Original file line numberDiff line numberDiff line change
@@ -1,56 +1,105 @@
1+
import { android, AndroidApplication } from 'application'
2+
13
export default {
24
install(Vue) {
35
const patchGo = router => {
4-
if (!router.go.__patched__) {
5-
if (router.history.index === -1) {
6-
// Todo: make sure this is indeed required
7-
// The problem: When using router.replace() to set the initial route
8-
// the history index stays -1, which then causes an issue when visiting a route,
9-
// going back, and then trying to visit again (the active route is not changed on nav back)
10-
// This fixes it, since it allows the router.go logic to run
11-
router.history.index = 0
12-
}
6+
if (router.go.__patched__) {
7+
return
8+
}
9+
10+
if (router.history.index === -1) {
11+
// Todo: make sure this is indeed required
12+
// The problem: When using router.replace() to set the initial route
13+
// the history index stays -1, which then causes an issue when visiting a route,
14+
// going back, and then trying to visit again (the active route is not changed on nav back)
15+
// This fixes it, since it allows the router.go logic to run
16+
router.history.index = 0
17+
}
1318

14-
const go = router.go
19+
const go = router.go
1520

16-
router.go = n => {
17-
if (n < 0) {
18-
for (let i = n; i < 0; ++i) {
19-
// Todo: figure out a cleaner way to navigate back n frames
20-
Vue.navigateBack()
21-
}
21+
router.go = n => {
22+
if (router.isPageRouter && n < 0) {
23+
for (let i = n; i < 0; ++i) {
24+
// Todo: figure out a cleaner way to navigate back n frames
25+
Vue.navigateBack()
2226
}
23-
24-
go.call(router, n)
2527
}
2628

27-
router.go.__patched__ = true
29+
go.call(router, n)< 10000 /div>
30+
}
31+
32+
router.go.__patched__ = true
33+
}
34+
35+
const registerGuards = router => {
36+
if (router.__patched__) {
37+
return
2838
}
39+
40+
router.afterEach(() => {
41+
if (!router.isPageRouter) {
42+
return
43+
}
44+
45+
const component = router.getMatchedComponents()[0]
46+
47+
Vue.navigateTo(component, {
48+
context: { router }
49+
})
50+
})
51+
52+
router.__patched__ = true
2953
}
3054

3155
Vue.mixin({
3256
beforeCreate() {
33-
if (this.$options.router) {
34-
this.__is_router__ = true
35-
const router = this.$options.router
36-
const self = this
37-
38-
patchGo(router)
39-
40-
this.$start = () => {
41-
this.__is_root__ = true
42-
this.__started__ = true
43-
44-
const initial = router.history.current.matched[0].components.default
45-
this.$navigateTo(initial, {
46-
context: { router },
47-
clearHistory: true
48-
}).then(() => {
49-
// Mount the root component (Should be <router-page>) to re 57AE gister router hooks
50-
const placeholder = Vue.$document.createComment('placeholder')
51-
self.$mount(placeholder)
52-
})
53-
}
57+
if (!this.$options.router) {
58+
// If there is no router, we don't care
59+
return
60+
}
61+
62+
const router = this.$options.router
63+
const self = this
64+
65+
// Handle back button on android
66+
if (android && !android.__patched__) {
67+
android.on(AndroidApplication.activityBackPressedEvent, e => {
68+
if (router.history.index !== 0) {
69+
e.cancel = true
70+
}
71+
router.back()
72+
})
73+
74+
android.__patched__ = true
75+
}
76+
77+
if (!router.hasOwnProperty('isPageRouter')) {
78+
Object.defineProperty(router, 'isPageRouter', {
79+
get() {
80+
return self.$options.pageRouting
81+
}
82+
})
83+
}
84+
85+
patchGo(router)
86+
registerGuards(router)
87+
88+
// Overwrite the default $start function
89+
this.$start = () => {
90+
this.__is_root__ = true
91+
this.__started__ = true // skips the default start procedure
92+
93+
// Mount the root component
94+
const placeholder = Vue.$document.createComment('placeholder')
95+
self.$mount(placeholder)
96+
97+
const initial = router.getMatchedComponents()[0]
98+
99+
this.$navigateTo(initial, {
100+
context: { router },
101+
clearHistory: true
102+
})
54103
}
55104
}
56105
})
Lines changed: 1 addition & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,4 @@
11
import { warn } from 'core/util/debug'
2-
import { topmost } from 'ui/frame'
3-
import { android, AndroidApplication } from 'application'
42

53
export default {
64
name: 'router-page',
@@ -11,21 +9,6 @@ export default {
119
warn('<router-page> should be a direct child of the root instance.')
1210
}
1311

14-
const router = parent.$router
15-
16-
router.afterEach(({ matched }) => {
17-
const component = matched[0].components.default
18-
19-
parent.$navigateTo(component, {
20-
context: { router }
21-
})
22-
})
23-
24-
if (android) {
25-
android.on(AndroidApplication.activityBackPressedEvent, e => {
26-
e.cancel = true
27-
router.back()
28-
})
29-
}
12+
parent.$options.pageRouting = true
3013
}
3114
}

0 commit comments

Comments
 (0)
0