v-switcher

    3.0.5 • Public • Published

    v-switcher

    usage

    yarn add v-switcher
    // or
    npm i v-switcher
    import Vue from 'vue'
    import VSwitcher from 'v-switcher'
    import 'v-switcher/dist/v-switcher.css'
    
    Vue.component(VSwitcher.name, VSwitcher)

    props

    name type default required description
    headers Array [] Y tab-header 的数组,支持 icon
    default-index Number 0 N 默认选中的 tab index
    routable Boolean false N 设为 true 则为路由模式
    animated Boolean false N 是否支持切换动画
    duration Number 300 N 切换动画的时长,ms
    align String start N tab 的展示模式 ['around', 'start', 'center', 'end', 'vertical']
    swipe Boolean false N 是否支持左右手势滑动
    headerTrigger String click N 头部动画触发的方式 ['click', 'hover']
    anchorTrigger String click N 锚点动画触发的方式 ['click', 'hover']
    anchorPadding Number 0 N 锚点元素的 padding 值
    autoplay Number 0 N 自动切换的时长(ms)默认不自动切换
    contentWidth String 100% N 每个 content 的宽度,默认 100%
    headerHeight Number 40 N 每个 item 的高度(px),默认 40
    fixedTop Number undefined N 如果设值,就为 headers fixed 时距离顶部的高度
    sticky Boolean false N 是否使用 100% 高度布局
    disabledSwipe Boolean false N 是否禁止 swipe 的 touch 事件
    continuousSwipe Boolean false N 当使用 swipe 的时候,是否是无限滚动模式,如果 autoplay > 0 则强制为 true

    example

    用例比较多,比较复杂,等之后有时间了补在线 demo,现在先把项目 clone 到本地 npm run dev 查看吧

    Install

    npm i v-switcher

    DownloadsWeekly Downloads

    1

    Version

    3.0.5

    License

    MIT

    Unpacked Size

    184 kB

    Total Files

    12

    Last publish

    Collaborators

    • avatar