vuex

问题 I've mapped chartData to a state property using vuex. What I'd like to do is update the chart when a dataset is updated. I have heard that it can be done with mixins or watchers but I don't know how to implement it. I understand that mixins creates a watcher but I don't know how it is used within vuex. Chartline.vue: <script> import { Line } from 'vue-chartjs' import { mapState } from 'vuex' export default { name: 'ChartLine', extends: Line, computed:{ ...mapState(['charData','options']) },

问题 I am trying to guard my routes by checking if the user is authenticated, this is the example route: { path: '/intranet', component: search, meta: { requiresAuth: true }, props: { tax: 'type', term: 'intranet-post', name: 'Intranet' } }, And I am setting the guard like this: router.beforeEach((to, from, next) => { if (to.matched.some(record => record.meta.requiresAuth)) { let authenticated = this.$store.getters['auth/getAuthenticated']; if (!authenticated) { next({ path: '/login', query: {

问题 I use vuex and mapGetters helper in my component. I got this function: getProductGroup(productIndex) { return this.$store.getters['products/findProductGroup'](productIndex) } Is it possible to move this somehow to mapGetters ? The problem is that I also pass an argument to the function, so I couldn't find a way to put this in mapGetters 回答1: If your getter takes in a parameter like this: getters: { foo(state) { return (bar) => { return bar; } } } Then you can map the getter directly: computed

问题 I use vuex and mapGetters helper in my component. I got this function: getProductGroup(productIndex) { return this.$store.getters['products/findProductGroup'](productIndex) } Is it possible to move this somehow to mapGetters ? The problem is that I also pass an argument to the function, so I couldn't find a way to put this in mapGetters 回答1: If your getter takes in a parameter like this: getters: { foo(state) { return (bar) => { return bar; } } } Then you can map the getter directly: computed

问题 I'm trying to test a basic Vue Component that makes reference to a Vuex store. I thought I followed Vue's example (https://vue-test-utils.vuejs.org/guides/using-with-vuex.html#mocking-getters) to a T but it doesn't appear to be working. I get the error that is mentioned in the title. const localVue = createLocalVue() localVue.use(Vuex) describe('Navbar.vue', () => { let store: any let getters: any beforeEach(() => { getters: { isLoggedIn: () => false } store = new Vuex.Store({ getters }) })

问题 EDIT: this question was very chaotic so I basically rewrite it with same code example and same scenerio. When 401 error is send in response from server I'm trying to .commit from interceptor to my vuex storage: import axios from 'axios'; import { store } from '../store/store'; export default function execute() { axios.interceptors.request.use(function(config) { const token = store.state.token; if(token) { config.headers.Authorization = `Bearer ${token}`; //console.log(config); return config;

问题 EDIT: this question was very chaotic so I basically rewrite it with same code example and same scenerio. When 401 error is send in response from server I'm trying to .commit from interceptor to my vuex storage: import axios from 'axios'; import { store } from '../store/store'; export default function execute() { axios.interceptors.request.use(function(config) { const token = store.state.token; if(token) { config.headers.Authorization = `Bearer ${token}`; //console.log(config); return config;

问题 I am having issues when making a client request. I have followed the documentation on Nuxt.js and Axios but I still can't seem to get it working. Maybe I am missing something.. My Vue component calling the vuex action : methods: { open() { this.$store.dispatch('events/getEventAlbum'); } } The action in vuex : export const actions = { async getEventAlbum(store) { console.log('album action'); const response = await Axios.get(url + '/photos?&sign=' + isSigned + '&photo-host=' + photoHost); store

问题 I am having issues when making a client request. I have followed the documentation on Nuxt.js and Axios but I still can't seem to get it working. Maybe I am missing something.. My Vue component calling the vuex action : methods: { open() { this.$store.dispatch('events/getEventAlbum'); } } The action in vuex : export const actions = { async getEventAlbum(store) { console.log('album action'); const response = await Axios.get(url + '/photos?&sign=' + isSigned + '&photo-host=' + photoHost); store

问题 I am having issues when making a client request. I have followed the documentation on Nuxt.js and Axios but I still can't seem to get it working. Maybe I am missing something.. My Vue component calling the vuex action : methods: { open() { this.$store.dispatch('events/getEventAlbum'); } } The action in vuex : export const actions = { async getEventAlbum(store) { console.log('album action'); const response = await Axios.get(url + '/photos?&sign=' + isSigned + '&photo-host=' + photoHost); store