vue 灵活的标签组件– vue-magic-line

vue 灵活的标签组件– vue-magic-line
插件名称 vue-magic-line
发布时间 2020年5月28日
插件作者 piccard21

vue-magic-line是用于Vue.js项目的响应式,灵活的选项卡组件。

安装和下载:

# Yarn
$ yarn add vue-magic-line

# NPM
$ npm install vue-magic-line --save

Properties

vue-magic-line

属性 描述 默认值
secondary 显示第二行 Boolean true
parent 适用于父母,不链接 Boolean true
magic-line-wrapper-css 类magic-line-wrapper的 CSS Object {}
magic-line-item-wrapper-css 类magic-line-item-wrapper的 CSS Object {}
magic-line-item-css magic-line-item的 CSS Object {}
magic-line-item-link-css 类magic-line-item-link的 CSS Object {}
magic-line-content-wrapper-css 类magic-line-content-wrapper的 CSS Object {}
primary-color 主线颜色 String rgb(0, 188, 212)
primary-height 主线高度 Number 3px
primary-top 给主线增加一些余量 Number 3px
secondary-color 辅助线颜色 String rgba(211, 211, 211, 0.4)
secondary-height 辅助线的高度 Number 2px
secondary-top 给第二行增加一些余量 Number 3px
duration 魔术线过渡的持续时间(以秒为单位) Number 0.3

vue-magic-line-tab

属笥 描述 默认值
active 设置活动标签 Boolean true
disabled 禁用标签 Boolean false

事件

事件 描述 参数
before-set-primary 定位主线之前 primary-line, tab
set-primary 定位主线后 primary-line, tab
before-set-secondary 放置辅助线之前 secondary-line, tab
set-secondary 定位辅助线后 secondary-line, tab