Commit b350098f442be1b8143b44e09e735179676f755c

Authored by vben
1 parent bfac425d

perf: adjust the logic of

CHANGELOG.zh_CN.md
... ... @@ -12,6 +12,10 @@
12 12 - 依赖更新
13 13 - 文档更新
14 14  
  15 +### ⚡ Performance Improvements
  16 +
  17 +- `setTitle`逻辑调整
  18 +
15 19 ### ✨ Refactor
16 20  
17 21 - 独立出`vite-plugin-html`,并修改相关插入 html 的逻辑
... ... @@ -19,6 +23,7 @@
19 23 ### 🐛 Bug Fixes
20 24  
21 25 - 修复热更新时多次注册组件警告问题
  26 +- 修复登录后出现登录标签页
22 27  
23 28 ## 2.0.0-rc.5 (2020-10-26)
24 29  
... ...
src/router/guard/index.ts
... ... @@ -2,14 +2,14 @@ import type { Router } from 'vue-router';
2 2  
3 3 import { Modal, notification } from 'ant-design-vue';
4 4 import { AxiosCanceler } from '/@/utils/http/axios/axiosCancel';
5   -import { createPageTitleGuard } from './pageTitleGuard';
6 5 import { createProgressGuard } from './progressGuard';
7 6 import { createPermissionGuard } from './permissionGuard';
8 7 import { createPageLoadingGuard } from './pageLoadingGuard';
9 8 import { useSetting } from '/@/hooks/core/useSetting';
10 9 import { getIsOpenTab, setCurrentTo } from '/@/utils/helper/routeHelper';
  10 +import { setTitle } from '/@/utils/browser';
11 11  
12   -const { projectSetting } = useSetting();
  12 +const { projectSetting, globSetting } = useSetting();
13 13 export function createGuard(router: Router) {
14 14 const { openNProgress, closeMessageOnSwitch, removeAllHttpPending } = projectSetting;
15 15 let axiosCanceler: AxiosCanceler | null;
... ... @@ -33,8 +33,16 @@ export function createGuard(router: Router) {
33 33 setCurrentTo(to);
34 34 return true;
35 35 });
  36 +
  37 + router.afterEach((to) => {
  38 + // change html title
  39 +
  40 + setTimeout(() => {
  41 + setTitle(to.meta.title, globSetting.title);
  42 + }, 0);
  43 + });
  44 +
36 45 openNProgress && createProgressGuard(router);
37 46 createPermissionGuard(router);
38   - createPageTitleGuard(router);
39 47 createPageLoadingGuard(router);
40 48 }
... ...
src/router/guard/pageTitleGuard.ts deleted 100644 → 0
1   -import type { Router } from 'vue-router';
2   -
3   -import { useSetting } from '/@/hooks/core/useSetting';
4   -
5   -/**
6   - * 设置页面标题
7   - * @param {*} title :页面标题
8   - */
9   -const setDocumentTitle = (title: string) => {
10   - document.title = title;
11   - const ua = navigator.userAgent;
12   - const regex = /\bMicroMessenger\/([\d.]+)/;
13   - // 兼容
14   - if (regex.test(ua) && /ip(hone|od|ad)/i.test(ua)) {
15   - const i = document.createElement('iframe');
16   - i.src = '/favicon.ico';
17   - i.style.display = 'none';
18   - i.onload = function () {
19   - setTimeout(function () {
20   - i.remove();
21   - }, 9);
22   - };
23   - document.body.appendChild(i);
24   - }
25   -};
26   -export const createPageTitleGuard = (router: Router) => {
27   - router.beforeEach(async (to) => {
28   - // This operation does not require synchronization
29   - setTimeout(() => {
30   - const { globSetting } = useSetting();
31   - if (to.meta.title) {
32   - const { title } = globSetting;
33   - const _title = to.meta.title ? ` ${to.meta.title}-${title} ` : `${title}`;
34   - setDocumentTitle(_title);
35   - }
36   - }, 30);
37   - return true;
38   - });
39   -};
src/utils/browser.ts
... ... @@ -70,3 +70,32 @@ export function isFirefoxFn() {
70 70 export function isOperaFn() {
71 71 return type === 'Opera';
72 72 }
  73 +
  74 +/**
  75 + * set page Title
  76 + * @param {*} title :page Title
  77 + */
  78 +const setDocumentTitle = (title: string) => {
  79 + document.title = title;
  80 + const ua = navigator.userAgent;
  81 + const regex = /\bMicroMessenger\/([\d.]+)/;
  82 + // 兼容
  83 + if (regex.test(ua) && /ip(hone|od|ad)/i.test(ua)) {
  84 + const i = document.createElement('iframe');
  85 + i.src = '/favicon.ico';
  86 + i.style.display = 'none';
  87 + i.onload = function () {
  88 + setTimeout(function () {
  89 + i.remove();
  90 + }, 9);
  91 + };
  92 + document.body.appendChild(i);
  93 + }
  94 +};
  95 +
  96 +export function setTitle(title: string, appTitle?: string) {
  97 + if (title) {
  98 + const _title = title ? ` ${title}-${appTitle} ` : `${appTitle}`;
  99 + setDocumentTitle(_title);
  100 + }
  101 +}
... ...
src/views/demo/feat/tab-params/index.vue
1 1 <template>
2   - <div class="p-4"> Current Param : {{ params }} </div>
  2 + <div class="p-4">
  3 + Current Param : {{ params }}
  4 + <input />
  5 + </div>
3 6 </template>
4 7 <script lang="ts">
5 8 import { computed, defineComponent, unref } from 'vue';
6 9 import { useRouter } from 'vue-router';
7 10 export default defineComponent({
  11 + name: 'TestTab',
8 12 setup() {
9 13 const { currentRoute } = useRouter();
10 14 return {
... ...