Gathering detailed insights and metrics for vueg-history
Installations
npm install vueg-historyDeveloper Guide
BETA
Typescript
No
Module System
CommonJS
Node Version
12.13.0
NPM Version
6.12.0
Score
71.7
Supply Chain
98.8
Quality
75.4
Maintenance
100
Vulnerability
100
License
Releases
Unable to fetch releases
Contributors
1
Unable to fetch Contributors
Languages
2
JavaScript
CSS
JavaScript (96.14%)
CSS (3.86%)
Love this project? Help keep it running — sponsor us today! 🚀
Developer
shirne
Download Statistics
Total Downloads
6,031
Last Day
1
Last Week
2
Last Month
15
Last Year
224
GitHub Statistics
1 Stars
139 Commits
1 Watching
1 Branches
1 Contributors
Bundle Size
59.36 kB
Minified
4.34 kB
Minified + Gzipped
Maintainers
1
Package Meta Information
Latest Version
1.6.0
Package Id
vueg-history@1.6.0
Unpacked Size
16.44 kB
Size
5.73 kB
File Count
6
NPM Version
6.12.0
Node Version
12.13.0
Total Downloads
Cumulative downloads
Total Downloads
6,031
Last day
0%
1
Compared to previous day
Last week
-71.4%
2
Compared to previous week
Last month
-42.3%
15
Compared to previous month
Last year
-91.3%
224
Compared to previous year
Daily Downloads
Weekly Downloads
Monthly Downloads
Yearly Downloads
Dependencies
1
Versions
-blue.svg){kind=icon}
修改版 shirne 2019/11/04
Forked from: jaweii/Vueg----page-transition-plugin
移除原来的记录离开路由的方法, 和根据路径深度判断进退的方法, 修改为记录路由历史, 并增加ts types
判断转场效果逻辑:
1.先判断是否初始化
2.优先从map判断, 有逻辑则忽略后续的先后判断
3.如果设置了根页面,从其它页面切换到根页面总是使用离场效果
4.从路由历史搜索, 有记录则设置为后退, 无记录设为前进
5.调整路由历史记录, 已存在则切除之后的路由, 不存在则存入新的
其它功能和设置不变
多页面场景切换效果
注意: 区别在我的页面再进二级页面后的返回效果
| VuegHistory效果 | Vueg效果 |
|---|---|
 |  |
Example：
使用方法
安装插件
1npm i vueg-history --save
引入插件
1import vueg from 'vueg-history' 2 3Vue.use(vueg, new Router(), Options) // 传入实例化后的router, Options为可选的插件配置 4
插件指令
插件注册了名为v-transition的指令，接收一个可选的Options参数，其包含的配置优先级高于全局配置。
启用插件：
为router-view添加v-transition指令后，该router-view下所有的页面都将启用动画：
1<router-view v-transition></router-view>
或，为template中的顶级标签添加v-transition指令后，该页面组件将启用动画效果:
1<template> 2 <page v-transition> 3 </page> 4</template>
支持Nuxt。
Options
1@property {number} duration 动画时长。默认为0.3 2@property {string} enter 入场动画，默认为'fadeInRight' 3@property {string} leave 离场动画，默认为'fadeInLeft' 4@property {boolean} useDepths 是否启用深度匹配。默认为false 5@property {boolean} shadow 是否为入场页面添加阴影。默认为true 6@property {Object} roots 根页面列表 从其它页面切换到根页面,总是使用离场效果。不影响map中匹配的效果 7@property {Object} map 默认为空情况下，vueg根据url深度判断是入场还是离场，但有时可能并不是你想要的效果，这时你可以使用map选项。 8例子：` 9roots: ['index','user'], 10map: { 11 'user-login':{ 12 enter: ['user-register'], 13 leave: ['index'], 14 disable: ['user-login-sms'] 15 } 16 } 17 ` 18上面例子表示，从名为`user-login`的路由到名为`user-regiseter`的路由转场，使用入场动画，反之则使用离场动画。 19从名为`user-login`的路由到名为`index`的路由转场，使用离场动画，反之则使用入场动画。 20从名为`user-login`的路由到名为`user-login-sms`的路由转场，禁用转场动画。 21 22 23
enter、leave 参数使用的animate.css的动画类名作为值，查看全部可用值，请访问：https://daneden.github.io/animate.css。
另外插件自带了一个可用值 touchPoint，动画效果为页面从触摸(点击)点放大入场。
No vulnerabilities found.
Reason
no binaries found in the repo
Reason
0 existing vulnerabilities detected
Reason
Found 0/30 approved changesets -- score normalized to 0
Reason
no SAST tool detected
Details
- Warn: no pull requests merged into dev branch
Reason
0 commit(s) and 0 issue activity found in the last 90 days -- score normalized to 0
Reason
no effort to earn an OpenSSF best practices badge detected
Reason
project is not fuzzed
Details
- Warn: no fuzzer integrations found
Reason
security policy file not detected
Details
- Warn: no security policy file detected
- Warn: no security file to analyze
- Warn: no security file to analyze
- Warn: no security file to analyze
Reason
license file not detected
Details
- Warn: project does not have a license file
Reason
branch protection not enabled on development/release branches
Details
- Warn: branch protection not enabled for branch 'master'
Score
2.6
/10
Last Scanned on 2025-01-27
The Open Source Security Foundation is a cross-industry collaboration to improve the security of open source software (OSS). The Scorecard provides security health metrics for open source projects.
Learn More