From 0b349dbfd02c20599a106dce2e0bcef7153cc1cd Mon Sep 17 00:00:00 2001 From: BeADre Date: Fri, 11 Jun 2021 20:06:54 +0800 Subject: [PATCH] perf: optimize progress bar --- packages/varlet-cli/site/pc/main.ts | 13 +++++++++++-- packages/varlet-cli/site/useProgress.ts | 2 +- packages/varlet-ui/src/progress/progress.less | 2 +- 3 files changed, 13 insertions(+), 4 deletions(-) diff --git a/packages/varlet-cli/site/pc/main.ts b/packages/varlet-cli/site/pc/main.ts index bbd0cb7ccb9..1ea7e3dad2d 100644 --- a/packages/varlet-cli/site/pc/main.ts +++ b/packages/varlet-cli/site/pc/main.ts @@ -21,11 +21,20 @@ const router = createRouter({ routes, }) +let isEnd = true const { start, end } = useProgress() -router.beforeEach(() => start()) +router.beforeEach(() => { + isEnd = false + setTimeout(() => { + if (!isEnd) start() + }, 200) +}) -router.afterEach(() => end()) +router.afterEach(() => { + isEnd = true + end() +}) window.top['router'] = router diff --git a/packages/varlet-cli/site/useProgress.ts b/packages/varlet-cli/site/useProgress.ts index 45539acce61..3fcb9a59173 100644 --- a/packages/varlet-cli/site/useProgress.ts +++ b/packages/varlet-cli/site/useProgress.ts @@ -13,7 +13,7 @@ export function useProgress() { }, trackColor: '#fff', color: '#3594d9', - lineWidth: 2, + lineWidth: 3, value: 0 }) diff --git a/packages/varlet-ui/src/progress/progress.less b/packages/varlet-ui/src/progress/progress.less index 8ecc9d5c662..16d232d9de7 100644 --- a/packages/varlet-ui/src/progress/progress.less +++ b/packages/varlet-ui/src/progress/progress.less @@ -41,7 +41,7 @@ background-color: @progress-background; top: 0; left: 0; - transition: all 0.2s; + transition: all 0.2s, background-color 0.8s; } &__label {