Getters can not call dispatch as they are passed the state not context of the store Actions can call state, dispatch, commit as they are passed the context. Getters are used to manage a ‘derived state’. If you instead set up the pets state on the components that require it then you would just call … Read more
Try to import ‘store’ with curly brackets import {store} from ‘../store/index’ store.getters.appSettings Another option is to access from the vue property import Vue from ‘vue’ Vue.store.getters.appSettings
Your code should work if you setup everything correctly: http://codepen.io/CodinCat/pen/RKZeZe?editors=1010 A very common mistake is that you didn’t give your state initial data. You should declare the state shape explicitly, so instead of state: {} // or state: { nav: {} } do this: state: { nav: { type: ‘…’ }, … } or the … Read more
You can do it by returning a promise from vuex action, as it is explained here and call the dispatch from within the beforeEnter itself. Code should look like following: import store from ‘./vuex/store’; // following is an excerpt of the routes object: { path: ‘/example’, component: Example, beforeEnter: (to, from, next) => { store.dispatch(‘initApp’).then(response … Read more
To answer this for any particular case, one would need the launch.json configuration being used, and the source folder structure, at minimum. I have a true story from just last week to illustrate why: Background I recently inherited a relatively small Vue project, and immediately encountered the same problem. Breakpoints in VSCode were “jumpy” in … Read more
I am using axios as HTTP client for making api calls, I have created a gateways folder in my src folder and I have put files for each backend, creating axios instances, like following myApi.js import axios from ‘axios’ export default axios.create({ baseURL: ‘http://localhost:3000/api/v1’, timeout: 5000, headers: { ‘X-Auth-Token’: ‘f2b6637ddf355a476918940289c0be016a4fe99e3b69c83d’, ‘Content-Type’: ‘application/json’ } }) Now … Read more
It could be a bit tricky to use v-model on a piece of state that belongs to Vuex. and you have used v-model on todo.text here: <input class=”edit” type=”text” v-model=”todo.text” v-todo-focus=”todo == editedTodo” @blur=”doneEdit(todo)” @keyup.enter=”doneEdit(todo)” @keyup.esc=”cancelEdit(todo)”> use :value to read value and v-on:input or v-on:change to execute a method that perform the mutation inside an … Read more
Assuming you’re using vue-router (and you probably should be), then you’ll want to use the beforeRouteLeave guard. The documentation even gives an example of this exact situation: beforeRouteLeave (to, from , next) { const answer = window.confirm(‘Do you really want to leave? you have unsaved changes!’) if (answer) { next() } else { next(false) } … Read more
Try the following delete axios.defaults.headers.common[“Authorization”]; // or which ever header you have to remove
Your watch should look like this. watch: { searchStr: _.debounce(function(newVal){ this.checkSearchStr(newVal) }, 100) }, This is a bit unusual, however. I don’t see why you would want to debounce a watch. Possibly you would rather just debounce the checkSearchStr method. watch: { searchStr(newVal){ this.checkSearchStr(newVal) } }, methods: { checkSearchStr: _.debounce(function(string) { console.log(this.foo) console.log(this.$store.dispatch(‘someMethod’,string)) }, 100) … Read more