实现选中的导航菜单在页面刷新后保持一致的功能

系统登录后默认让用户进行myPaer导航菜单，当用户点击菜单后更新当前选中菜单项，并存储对应的菜单数据，同时利用watch来监听导航菜单的变化，防止页面刷新后前后数据不一致

       <div
          class="menu-item"
          :style="{
            background: activeMenuPath == item.path ? '#f2f2f2' : '',
          }"
          v-for="item in menuList"
          @click="clickMenu(item)"
        >
          {{ item.label }}
        </div>

let activeMenuPath = ref<any>(localStorage.getItem("activeMenu") || "/myPaper");

const clickMenu = (item: any) => {
  activeMenuPath.value = item.path;
  localStorage.setItem("activeMenu", item.path);
  if (
    route.path !== item.path &&
    !(route.path == "/home" && item.path == "/")
  ) {
    router.push(item.path);
  }
};

// 实现选中的导航菜单在页面刷新后保持一致的功能
watch(route, (to) => {
  activeMenuPath.value = to.path;
  localStorage.setItem("activeMenu", to.path);
});