Stack Overflow
Stack Overflow

Questions tagged [vuex]

Vuex is a state management pattern + library for Vue.js applications. It serves as a centralized store for all the components in an application, with rules ensuring that the state can only be mutated in a predictable fashion.

Vuex is a data management library by the creator of Vue.js. It is designed to help build larger applications in a more maintainable way by following principles similar to those made popular by Facebook’s Flux library (and subsequent iterations by community like redux).

Principles

  • Terse
  • Testable
  • Reactive
  • Single State Tree
  • Hot Reloading
  • Time Travel (with vue-devtools support)

GitHub: https://github.com/vuejs/vuex Documentation: https://vuex.vuejs.org/en/

7756 questions
40
votes
8 answers

$store properties are not reactive when using computed property (Vuex)

I have a Vuex store, which I'm injecting into my instance: import store from '../store'; const mainNav = new Vue({ el: '#main-nav', store, components: { NavComponent } }); And I'm creating a computed property from that store in the…
babbaggeii
  • 7,577
  • 20
  • 64
  • 118
39
votes
4 answers

Can I do dispatch from getters in Vuex

Fiddle : here I am creating a webapp with Vue 2 with Vuex. I have a store, where I want to fetch state data from a getter, What I want is if getter finds out data is not yet populated, it calls dispatch and fetches the data. Following is my Vuex…
Saurabh
  • 71,488
  • 40
  • 181
  • 244
38
votes
2 answers

Separating vuex stores for dynamically created components

This was the question got me stuck for a little bit. Unfortunately, I coudn't find answer here (asking also didn't help). So after doing some research and asking here and there, it seems that I got the solution to this issue. If you have a…
ogostos
  • 1,435
  • 2
  • 20
  • 29
37
votes
3 answers

How should I handle events in Vuex?

I am used to using a global event bus to handle cross-component methods. For example: var bus = new Vue(); ... //Component A bus.$emit('DoSomethingInComponentB'); ... //Component B bus.$on('DoSomethingInComponentB', function(){ this.doSomething()…
Aaa
  • 900
  • 3
  • 9
  • 22
36
votes
10 answers

cannot read property 'dispatch' of undefined in Vuex

I'm trying to perform a dispatch on 'logOutUser' in vuex store, and i'm getting the following error message in respone: TypeError: Cannot read property 'dispatch' of undefined deleteUser.vue (the component from which the dispatch action is not…
Tom Harpaz
  • 489
  • 1
  • 4
  • 8
35
votes
3 answers

What is the Vuex "context" object?

I am trying to get better understanding of what the "context" object is in Vuex. The context object is referred to numerous times in the Vuex documentation. For example, in https://vuex.vuejs.org/en/actions.html, we have: Action handlers receive…
Kobi
  • 4,003
  • 4
  • 18
  • 23
34
votes
2 answers

Vue.js[vuex] how to dispatch from a mutation?

I have a list of filters I want to apply to a json object. My mutations look like this: const mutations = { setStars(state, payload) { state.stars = payload; this.dispatch('filter'); }, setReviews(state, payload) { …
Stephan-v
  • 19,255
  • 31
  • 115
  • 201
33
votes
2 answers

Axios interceptor in vue 2 JS using vuex

I store token after success login call in vuex store like this: axios.post('/api/auth/doLogin.php', params, axiosConfig) .then(res => { console.log(res.data); // token this.$store.commit('login', res.data); }) axiosConfig is…
BT101
  • 3,666
  • 10
  • 41
  • 90
33
votes
2 answers

Pass params to mapGetters

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…
Victor
  • 5,073
  • 15
  • 68
  • 120
33
votes
1 answer

Recommended strategy to sync vuex state with server

Imagine this simple case. You have a Vue JS application in which users can create lists of tasks and sort them. These lists should be stored in a database by the server. Let's assume we have a ListComponent which does the bulk of the UX. My question…
Jose Ospina
  • 2,097
  • 3
  • 26
  • 40
33
votes
2 answers

Return value from vuex mutation? (id for newly created object)

I'm trying to create an object in one part of vuex store, and then pass id to it to another object, and i'm not sure how to properly do that since mutations can't return returning anything (in this case, id). Two store objects look like this: //…
Rudi
  • 2,450
  • 5
  • 26
  • 37
31
votes
5 answers

Vue/Vuex unknown action type

I have started implementing Vuex in my application and I decided to split my store into modules. For the beginning I created only one module to test how Vuex modules works because I didn't have any previous experience with it. I created a modules…
Aleksandar Milicevic
  • 523
  • 2
  • 6
  • 14
31
votes
4 answers

How to get vuex state from a javascript file (instead of a vue component)

I am working with vuex (2.1.1) and get things working within vue single file components. However to avoid too much cruft in my vue single file component I moved some functions to a utils.js module which I import into the vue-file. In this utils.js I…
musicformellons
  • 12,283
  • 4
  • 51
  • 86
30
votes
2 answers

Async/Await with Vuex dispatch

I am making a loader for some components in my app. Here is my component: mounted() { this.loading = true; this.getProduct(); }, methods: { async getProduct() { await…
user3118789
  • 589
  • 2
  • 12
  • 26
30
votes
1 answer

How is the correct way to work with Vuex and typescript?

So far, the only information I found about the topic was this article. I am trying to implement the store with 2 modules. export interface RootState { /** root state props **/ } const store: StoreOptions = { modules: { …
marcellorvalle
  • 1,631
  • 3
  • 17
  • 30
1 2 3
…
99 100