【库】nprogress 顶部进度条

 yarn add nprogress 

router文件

前置路由添加启动

后置路由添加关闭

router.beforeEach((to, from, next) => {

  NProgress.start()

  next()

})

router.afterEach(() => {

  NProgress.done()

})

App.vue 文件 

引入样式

<script setup>

import "nprogress/nprogress.css";

</script>

效果

相关推荐

  1. 【Vue.js 3.0】NProgress 进度

    2024-06-12 08:36:02       46 阅读
  2. 进度

    2024-06-12 08:36:02       32 阅读
  3. uni-app顶部导航固定

    2024-06-12 08:36:02       66 阅读

最近更新

  1. docker php8.1+nginx base 镜像 dockerfile 配置

    2024-06-12 08:36:02       94 阅读
  2. Could not load dynamic library ‘cudart64_100.dll‘

    2024-06-12 08:36:02       100 阅读
  3. 在Django里面运行非项目文件

    2024-06-12 08:36:02       82 阅读
  4. Python语言-面向对象

    2024-06-12 08:36:02       91 阅读

热门阅读

  1. php框架详解-symfony框架

    2024-06-12 08:36:02       30 阅读
  2. Docker:Docker基础

    2024-06-12 08:36:02       24 阅读
  3. docker——环境搭建

    2024-06-12 08:36:02       26 阅读
  4. 架构师 如何架构选型一个项目

    2024-06-12 08:36:02       22 阅读
  5. 如何通过 CDN 优化网站加载速度

    2024-06-12 08:36:02       29 阅读
  6. IPv6技术考点

    2024-06-12 08:36:02       28 阅读
  7. 【lesson8】云备份服务端完整版代码

    2024-06-12 08:36:02       22 阅读
  8. 设计模式-解释器模式

    2024-06-12 08:36:02       30 阅读