vuex安装和vuex持久化插件

1.安装vuex

npm install vuex@3.6.2 --save

2.新建store/index.js

import Vuex from 'vuex'
import Vue from 'vue'


Vue.use(Vuex)

export default new Vuex.Store({
  state: {
    
  },
  mutations: {
    
  },
  getters: {
    
  }
})

3.在main.js中引入store文件夹，main.js文件：

import store from "./store"    

new Vue({
  el: '#app',
  router,
  store,                      // 这里记得要加上
  components: { App },
  template: '<App/>'
})
        

4.安装一个vuex的插件vuex-persistedstate来支持vuex的状态持久化

npm i vuex-persistedstate@3.2.1

5.store/index.js中引入vuex持久化方法createPersistedState

import createPersistedState from "vuex-persistedstate"

6.store中使用

export default new Vuex.Store({
  plugins: [createPersistedState({
    storage: window.sessionStorage
  })],
  state: {
    // phone: ''
  },
  mutations: {
    // set_phone(state, phone) {
    //   state.phone = phone
    // }
  },
  getters: {
    // get_phone(state) {
    //   return state.phone
    // }
  }
})