How to navigate using vue router from Vuex actions

javascript vue.js vuex
Saurabh picture Saurabh · Nov 22, 2016 · Viewed 62k times · Source

I am creating a web app with Vue 2.x and Vuex 2.x. I am fetching some information from a remote location via an http call, I want that if that call fails I should redirect to some other page.

GET_PETS: (state) => {
  return $http.get('pets/').then((response)=>{
      state.commit('SET_PETS', response.data)
    })
  },
  error => {this.$router.push({path:"/"}) }
  )
}

But this.$router.push({path:"/"}) gives me following error.

Uncaught (in promise) TypeError: Cannot read property 'push' of undefined

How can this be achieved.

Simulated JsFiddle: here

Answer

Marek Urbanowicz picture Marek Urbanowicz · Nov 22, 2016

import router from './router'

and use router.push

Simple like that.

Related questions

vue.js 2 how to watch store values from vuex

I am using vuex and vuejs 2 together. I am new to vuex, I want to watch a store variable change. I want to add the watch function in my vue component This is what I have so far: import Vue …

Read More
Vuex state on page refresh

My app uses the Firebase API for User Authentication, saving the Login status as a boolean value in a Vuex State. When the user logs in I set the login status and conditionally display the Login/Logout button accordingly. But …

Read More
Can I call commit from one of mutations in Vuex store

I have a vuex store, like following: import spreeApi from '../../gateways/spree-api' // initial state const state = { products: [], categories: [] } // mutations const mutations = { SET_PRODUCTS: (state, response) => { state.products = response.data.products commit('SET_CATEGORIES') }, SET_CATEGORIES: (state) => { state.…

Read More