You can’t do this through vue-router, but you can add a scroll-to-top method to every router-link. Just create a method like this: methods: { scrollToTop() { window.scrollTo(0,0); } } Add it to the link: <router-link @click.native=”$scrollToTop”> If you want to use it outside of your footer too, it’s better to add it to the Vue … Read more
<router-view :some-value-to-pass=”localValue”></router-view> and in your components just add prop: props: { someValueToPass: String }, vue-router will match prop in component
This can be achieved by adding the redirect path in the route as a query parameter. Then when you login, you have to check if the redirect parameter is set: if IS set redirect to the path found in param if is NOT set you can fallback on root. Put an action to your link … Read more
I spent hours debugging this and got to the following results for the ugly Uncaught (in promise) Error: Redirected when going from … Error. Note that the error is not for the “redirect”. It’s for the initial caller of the first navigation. Keep reading… It’s by design. Why? Read this comment. TL;DR: Let’s say you … Read more
I think you can simple call like this, this will give you result value. this.$route.query.page Look image $route is object in Vue Instance and you can access with this keyword and next you can select object properties like above one : Have a look Vue-router document for selecting queries value : Vue Router Object
You can use a navigation guard with the router definition: import Vue from ‘vue’; const DEFAULT_TITLE = ‘Some Default Title’; router.afterEach((to, from) => { // Use next tick to handle router history correctly // see: https://github.com/vuejs/vue-router/issues/914#issuecomment-384477609 Vue.nextTick(() => { document.title = to.meta.title || DEFAULT_TITLE; }); }); You’ll need to change your export to: const router … Read more
I think you should be able to use a default route handler and redirect from there to a page outside the app, as detailed below: const ROUTER_INSTANCE = new VueRouter({ mode: “history”, routes: [ { path: “/”, component: HomeComponent }, // … other routes … // and finally the default route, when none of the … Read more
You can use tag prop. <router-link to=”/foo” tag=”button”>foo</router-link> Please use v-slot if you use 3.0+ (thanks to Romain and Jeff)
You can use Programmatic Navigation. In order to go back, you use this: router.go(n) Where n can be positive or negative (to go back). This is the same as history.back().So you can have your element like this: <a @click=”$router.go(-1)”>back</a>
You are using computed incorrectly. You should return the property in the function. See the docs for more information. Here is your adapted example: computed: { currentRouteName() { return this.$route.name; } } You can then use it like this: <div>{{ currentRouteName }}</div> You can also use it directly in the template without using a computed … Read more