Aqui está um exemplo simples da Vuex Store:
import { createStore } from 'vuex';
const store = createStore({
state: {
count: 0,
message: 'Hello Vuex!'
},
mutations: {
increment(state) {
state.count++;
},
setMessage(state, newMessage) {
state.message = newMessage;
}
},
actions: {
incrementAsync({ commit }) {
setTimeout(() => {
commit('increment');
}, 1000);
}
},
getters: {
getCount(state) {
return state.count;
},
getMessage(state) {
return state.message;
}
}
});
export default store;
A Loja Vuex neste exemplo contém estado, mutações, ações e getters.
state
É onde o estado do aplicativo é armazenado e pode ser acessado em componentes.mutations
São definidas funções que modificam o estado, recebem umstate
objeto como primeiro parâmetro e podem sercommit
acionadas chamando um método.actions
Contém operações assíncronas ou mutações em lote, que podem serdispatch
acionadas pela chamada de métodos.getters
Fornece métodos para calcular e acessar dados armazenados no estado, utilizando-os como propriedades.
Você pode modificá-lo e ampliá-lo de acordo com as necessidades do seu negócio. Ao usar o armazenamento em um aplicativo, você pode store
acessar o estado, as mutações, as ações e os getters definidos nele importando objetos.