I want to call router.go
inside a component
currently i have set window.router = router
// so the code works
index.js
const App = Vue.extend(require('./views/app.vue')) router.start(App, '#app') window.router = router // I don't want to set this global variable
navbar.vue
methods: { search () { window.router.go({ name: 'search', query: { q: this.query } }) } }
what i am looking for is something like, this.$router.go
navbar.vue
methods: { search () { this.$router.go({ name: 'search', query: { q: this.query } }) } }
Thanks and really appreciate some help
To have the Vue-Router routes be rendered you will need to pass the <router-view> tag inside a Vue component. You could also access the routes from an <a> tag, but this will trigger a page re-render, to avoid this behavior you could use router-link with the to property instead of a href .
As an example you could use beforeRouteEnter , an in-component navigation guard, to get the previous route and store it in your data .. ... data() { return { ... prevRoute: null } }, beforeRouteEnter(to, from, next) { next(vm => { vm.
With Vue Router, you can use its router. push() function to programmatically navigate between routes on your site. You can either call push() with a string path, or with an object containing either the path or name of the route.
to open a Vue Router link in a new tab, we can call the $router. resolve method to get the full URL from the route name, path, parameter and query values. Then we can use window. open to open the URL in a new tab.
For vue-router
2.x
this.$router.push('path')
For vue-router
1.x
this.$route.router.go('path')
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With