Take notes on recent vuex use

How do I install my index.js structure

import Vue from "vue"; import Vuex from "vuex"; import VuexPersist from "vuex-persist"; Vue.use(Vuex); // const vuexLocal = new VuexPersist({storage: window.localstorage // optional, sessionStorage/indexDB}); // new VuexPersist({storage: window.localstorage // optional, sessionStorage/indexDB}); export default new Vuex.Store({ state: {}, mutations: {}, getters: {}, actions: {}, modules: {}, plugins: [vuexLocal.plugin] });Copy the code

1. First of all, vuex is stored in memory after installation. It is only a public variable. The storage mechanism of this component should only add a step to write into and take out of the original VUex from the disk. When I save, I write into the memory and the disk. When I take out, I delete the disk data and still get it from the memory, but I don’t know the sequence of accessing the disk memory.

2. Five attributes in vuex: State, getters, mutations, Actions and modules

State: A place to store data, similar to the use of data in a VUE file. Since VUE has a single data source, there can only be one state.

Getters: is a calculation attribute in VUE. When I first used it, I was confused by its name and thought it was similar to get and set methods, and put the operation of fetching data here, but it seems that there is nothing wrong with it except taking an extra step. The method in getters receives state as an external parameter. I use it as an external parameter to fetch data. GetValue :state=>e=>{return}, this.$store.getters.getValue(e);

Mutations: equivalent to methods, which defines methods, calls this. codestore.com MIT (“funName”, “value”); Synchronous method

Actions: Unlike mutations, the actions method is an asynchronous method that returns a promise, calling this.$store.dispatch(“funName”, “value”).

Modules: Since there can only be one state in a single tree, it is possible to add a set of these five properties to modules to solve the inconvenience