vue中使用npm 命令安装的nprogress以及如何修改颜色/位置
1.安装npm install --save nprogress或者yarn add nprogress2.使用在router.js中//导入import NProgress from 'nprogress'import 'nprogress/nprogress.css'//在路由守卫中可以直接使用使用下边的四个方法3.方法NProgress.start() — 开始出现进度条NProgress.
·
1.安装
npm install --save nprogress
或者
yarn add nprogress
2.使用
在router.js
中
//导入
import NProgress from 'nprogress'
import 'nprogress/nprogress.css'
//在路由守卫中可以直接使用使用下边的四个方法
3.方法
NProgress.start()
— 开始出现进度条NProgress.set(0.4)
— 设置百分比NProgress.inc()
— 递增NProgress.done()
— 进度条结束
4.在守卫中使用
独享守卫开始
beforeEnter: (to, from, next) => {
NProgress.start()
next()
},
路由结束触发
router.afterEach((to, from, next) => {
NProgress.done()
})
5.修改样式
打开项目文件夹
搜索nprogress
结果
打开css修改样式
更多推荐
已为社区贡献2条内容
所有评论(0)