state.js
state:{
data:{}
}
mutation.js
type.data (state, arg) {
return state.data = arg
}
action.js
commit(types.data, {a: 111, b: 222})
getters.js
export const data = (state) => {
return state.data
}
this.$store.getters.data //{a:111, b:222}
this.$store.state.data //{a:111, b:222}
,.
this.$store.getters.data.a // undefined
this.$store.state.data.a // undefinedlandlord, you can refer to this article, Portal
. < hr >here is the code for my local test, and the conclusion is that it is all values that can be taken
. / / vuex related
/ / store.js
state.js
state: {
remind: {}
}
mutation_types.js
export const REMAIND = 'REMAIND'
mutation.js
[type.REMIND] (state, arg) {
state.remind = arg
}
actions.js
getdata ({state, commit}, arg) {
...,
commit(types.REMAIND, {free: res.data.freeNum, queue: res.data.queueNum})
}
getters.js
export const remind = (state) => {
return state.remind
}
test.vue
methods:{
submit () {
this.$store.dispatch('getData')
console.log(this.$store.getters.remind) // {obj....arry(0)}
console.log(this.$store.getters.remind.free) // undefined
console.log(this.$store.getters.remind.queue) // undefined
}
}
the first click on submit is empty
the second click on submit is worth it.
both state, and getters are like this. Why?
when namespaced is not used, actions is registered globally by default, but after use, actions will become under the module, but I don t want to do this. I also want it to be global. My namespace:true is just for the convenience that I introduce state, ...
there are more than 10 methods for methods in one of my .vue files, and this page looks messy. is it because my componentization is not thorough enough; is there any way to make the file more concise ...
I want a variable in the drop-down box v-model data, and the default value of this variable is the constant defined in state, but what if it doesn t change with the value in state? reference: https: codeshelper.com q 10. The value of computed canno...
as shown in the figure, I get the data in vuex in created. I can get it as soon as I enter the page, but I can t get the data after the page is refreshed ...
[vue] Why use vuex instead of window.obj to maintain global instance properties and methods? ...
problem description I currently have a parent component, which has more than 20 child components A1, a2, and so on, and I want them to update their balances. What s the best way to deal with it. the environmental background of the problems and what...
the code is as follows: import headerVue from ". components header.vue"; import bodyVue from ". components body.vue"; import footerVue from ". components footer.vue"; import connector from ". components connector.js&q...
model: there are two ways: 1. this.getData().then(data => { data; }) Mode 1 is to save a state in vuex , and in many cases, I first call updateData to make sure that data in state is up-to-date. method 2 does not need state , but ...