The following is a very simple example of a counter that summarizes the core concepts of Vuex in a self-contained HTML file:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Simple counter example</title>
</head>
<body>
<div id="app"></div>
<script src="https://unpkg.com/vuex@3.0.1/dist/vuex.min.js"></script>
<script src="https://unpkg.com/vue@2.5.13/dist/vue.min.js"></script>
<script>
Vue.use(Vuex);
// Sequential module
const sequential = {
namespaced: true,
state() {
return {
count: 1,
};
},
mutations: {
increment: state => state.count++,
decrement: state => state.count--
},
actions: {
increment: ({ commit }) => commit('increment&apos...