vue-quick-menu是一个应用于移动端的快速导航组件。它拥有炫酷的展开和收起时的动画效果。它支持自定义菜单的显示位置,菜单的数量,颜色等属性。
demo
安装
通过NPM安装
npm install vue-quick-menu --save
插件应用
这是一个使用的例子
<quick-menu :menu-count=count :icon-class=icons :menu-url-list=list></quick-menu>
import Vue from 'vue'
import quickMenu from 'vue-quick-menu'
export default {
...
components: {
quickMenu
},
...
}
插件参数
Property |
Type |
Default |
Description |
menuCount |
Number |
4 |
导航菜单的数量 可选2,3,4 |
menuUrlList |
Array |
- |
菜单的url的数组 |
iconClass |
Array |
- |
菜单项的图标 |
position |
top-left,top-right,bottom-left or bottom-right |
top-left |
菜单的位置 |
backgroundColor |
String |
#009dc7 |
菜单的背景色 |
color |
String |
#ffffff |
菜单图标的颜色 |
isOpenNewTab |
Boolean |
false |
是否在原窗口打开菜单指向的url |
最后推荐一下轮子工厂--一个分享vue,angular优秀组件的网站