同步存储读取vuex中store中的值

import store from "./store";
Vue.prototype.$store = store;

import Vue from "vue";
import Vuex from "vuex";
Vue.use(Vuex);
export default new Vuex.Store({
  state: {
    username: "",
  },
  // 同步  第一个形参 代表state
  //name形参代表的是  你此时传递过来的参数
  mutations: {
    getTopClickMenuName: (state, name) => {
      state.username = name; //赋值
    },
  },
  actions: {},
  modules: {},
});

<van-button type="warning" @click="add">++</van-button>
<van-button type="danger">{{ $store.state.username }}</van-button>
methods: {
    //调用函数，
    add() {
      this.$store.commit("getTopClickMenuName", this.$store.state.username + 1);
    },
},

<h1>{{ $store.state.username }}--</h1>

<h1>{{ atoB }}--</h1>
computed: {
    atoB() {
      return this.$store.state.username;
    },
  },

created() {
    //在页面加载时读取sessionStorage里的状态信息
    if (sessionStorage.getItem("username")) {
      this.$store.replaceState(
        Object.assign(
          {},
          this.$store.state,
          JSON.parse(sessionStorage.getItem("username"))
        )
      );
    }
    //在页面刷新时将vuex里的信息保存到sessionStorage里
    window.addEventListener("beforeunload", () => {
      sessionStorage.setItem("username", JSON.stringify(this.$store.state));
    });
  },