Vue Router This.$Router.Push Not Working on Methods

Vue Router this.$router.push not working on methods

You have to push to a name or path
Try this:

this.$router.push({ path: '/' })
this.$router.push({ name: 'Home' })

$router.push Not Working?

I ended up using @click.native="$router.push('/my/cool/link')" on the Card component.

Vue $route.push not working when called from method

Check out the note at the bottom of the router.push section: https://router.vuejs.org/guide/essentials/navigation.html

Note: If the destination is the same as the current route and only params are changing (e.g. going from one profile to another /users/1 -> /users/2), you will have to use beforeRouteUpdate to react to changes (e.g. fetching the user information).

...and here is how to use beforeRouteUpdate:
https://router.vuejs.org/guide/essentials/dynamic-matching.html#reacting-to-params-changes

Hope this helps!

vue-router: this.$router.push not working when updating query

You shouldn't try to push to the route object. Instead you should use one of these:

// literal string path
router.push('home')

// object
router.push({ path: 'home' })

// named route
router.push({ name: 'user', params: { userId: 123 }})

// with query, resulting in /register?plan=private
router.push({ path: 'register', query: { plan: 'private' }})

In your case:

this.$router.push({path: this.$route.path, query: {disp: disp}})

$router.push() not a function error using Vuex

What you can do is import your router module into your vuex module like so:

import {router} from "../main.js"
// or
import router from '../router'

export default {
  actions: {
    createProject () {
      this.$store
        .dispatch("project/postProject", this.project)
        .then(response => {
          router.push({
            name: "project-update",
            params: { id: response.data.data.id }
          })
        })
        .catch(() => { })
    }
  }
}

error while using params in the router.push function vue-router 4

i figured out what's happening i have a component called pageTitle this component is included by every other component i use it to make the breadcrumb using the:

this.$route.fullPath

then spliting it and looping the values with :

<li><router-link></router-link></li>

to make the breadcrumbs links but the fullPath prop of the vue router it returns the params too so through the loop in:

<router-link :to="{ name: {path} }">{{ path }}</router-link>

vue checks if the router is exists with the given name, for example when i put /actions-log/3 as params int the url it will be set in the :to attribute becuase of this behavios it's launch that exception;

so i think i solved the problems in the following computed fuction :

i don't know if someone has a better idea to create a breadCrumbs in vue...
anyway thank you so much for helping me to resolve this problem.

---

Related Topics