useTitle.ts 1.2 KB

12345678910111213141516171819202122232425262728293031323334353637383940
  1. /**
  2. * Copyright (c) 2013-Now https://jeesite.com All rights reserved.
  3. * No deletion without permission, or be held responsible to law.
  4. * @author ThinkGem
  5. */
  6. import { watch, unref } from 'vue';
  7. import { useI18n } from '@jeesite/core/hooks/web/useI18n';
  8. import { useTitle as usePageTitle } from '@vueuse/core';
  9. import { useGlobSetting } from '@jeesite/core/hooks/setting';
  10. import { useRouter } from 'vue-router';
  11. import { useUserStore } from '@jeesite/core/store/modules/case';
  12. import { REDIRECT_NAME } from '@jeesite/core/router/constant';
  13. /**
  14. * Listening to page changes and dynamically changing site titles
  15. */
  16. export function useTitle() {
  17. const { title } = useGlobSetting();
  18. const { t } = useI18n();
  19. const { currentRoute } = useRouter();
  20. const userStore = useUserStore();
  21. const pageTitle = usePageTitle();
  22. watch(
  23. () => [currentRoute.value.path, userStore.getPageCacheByKey('title', title)],
  24. () => {
  25. const route = unref(currentRoute);
  26. if (route.name === REDIRECT_NAME) {
  27. return;
  28. }
  29. const appTitle = userStore.getPageCacheByKey('title', title);
  30. pageTitle.value = appTitle || t(route?.meta?.title as string) || title;
  31. },
  32. { immediate: true },
  33. );
  34. }