Skip to content

Commit 11c060a

Browse files
committed
Improve Readme
1 parent 43d65a2 commit 11c060a

File tree

3 files changed

+22
-13
lines changed

3 files changed

+22
-13
lines changed

README.md

Lines changed: 19 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,5 @@
11
# NativeScript Vue Router
2+
23
[npm-url]: https://npmjs.org/package/nativescript-vue-router-extended
34
[npm-image]: http://img.shields.io/npm/v/nativescript-vue-router-extended.svg
45

@@ -21,13 +22,15 @@ Please file an issue or make a PR if you spot any problems or you have any furth
2122
- [API & Limitations](#api-limitations)
2223

2324
## Features
25+
2426
- Same hooks and guards for mobile and web
2527
- Additional action dispatcher to dispatch actions to store automatically when changing routes
2628
- Vue-Router 4 API compatibility
2729
- NativeScript-Vue compatible
2830
- TypeScript Support out of the box
2931

3032
## Todo
33+
3134
- Test coverage
3235
- More compatibility (PRs and issues are welcomed so don't hesistate to report please)
3336

@@ -111,9 +114,8 @@ const router = createRouter(
111114
}
112115
);
113116

114-
// From now on you can access this.$router, this.$routeBack and special this.$routeTo inside of the components
115-
116117
// Register a global guard (optional)
118+
// You can also use global router.beforeResolve guard and router.afterEach hook
117119
router.beforeEach((to) => {
118120
// For example, verify per route access rules
119121
if (!canAccessRoute(to)) {
@@ -123,7 +125,14 @@ router.beforeEach((to) => {
123125
return true;
124126
});
125127

126-
// You can also use global router.beforeResolve guard and router.afterEach hook
128+
// From now on you can access this.$router, this.$routeBack and special this.$routeTo inside of the components, example:
129+
this.$routeTo("/movies", {
130+
// Clear History is a NativeScript setting
131+
clearHistory: true,
132+
props: {
133+
movieId: 12,
134+
},
135+
});
127136
```
128137

129138
## New hooks for pages
@@ -163,13 +172,13 @@ export default {
163172
</script>
164173
```
165174

166-
| NS Event | Mapped as | Description |
167-
| ------------------ | ----------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ |
168-
| navigatingFrom | `beforeRouteLeave` | Before user leaves the route |
169-
| navigatingTo | `beforeRouteEnter` | Before user enters a route |
170-
| - | `beforeRouteUpdate` | Before route is changed but view remains the same. This can happen when path is exactly the same but you change e.g. passed prop to the route. Please refer to Vue-Router docs for more details. |
171-
| navigatedTo | `beforeRouteEnter` | To trigger it properly you need to access component instance. You can use `next(vm => ...)` callback within `beforeRouteEnter()`. Please check Vue-Router docs for more details. |
172-
| navigatedFrom | - | This event is tricky to control for developers. There is no exact mapping of it in the router. For store state cleanup use build-in meta dispatcher instead. For component state you could opt for using `beforeRouteLeave()`. You could potentially use `navigatedFrom` directly inside of the page but you |
175+
| NS Event | Mapped as | Description |
176+
| -------------- | ------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ |
177+
| navigatingFrom | `beforeRouteLeave` | Before user leaves the route |
178+
| navigatingTo | `beforeRouteEnter` | Before user enters a route |
179+
| - | `beforeRouteUpdate` | Before route is changed but view remains the same. This can happen when path is exactly the same but you change e.g. passed prop to the route. Please refer to Vue-Router docs for more details. |
180+
| navigatedTo | `beforeRouteEnter` | To trigger it properly you need to access component instance. You can use `next(vm => ...)` callback within `beforeRouteEnter()`. Please check Vue-Router docs for more details. |
181+
| navigatedFrom | - | This event is tricky to control for developers. There is no exact mapping of it in the router. For store state cleanup use build-in meta dispatcher instead. For component state you could opt for using `beforeRouteLeave()`. You could potentially use `navigatedFrom` directly inside of the page but you |
173182

174183
## API & Limitations
175184

src/package-lock.json

Lines changed: 2 additions & 2 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

src/package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "nativescript-vue-router-extended",
3-
"version": "1.0.1",
3+
"version": "1.0.2",
44
"description": "NativeScript Vue Router Extended for NativeScript Vue hybrid Apps.",
55
"main": "vue-router",
66
"nativescript": {

0 commit comments

Comments
 (0)