Y-scrollbar NPM

`@weier/w-scrollbar`

滚动条容器

// 安装
npm i @weier/w-scrollbar -S

// 代码引入（可选）
import Vue from 'vue'
import WScrollbar from '@weier/w-scrollbar'
Vue.use(WScrollbar)

基础用法

容器外的宽高需已知(可滚动即可) noresize 如果 container 尺寸不会发生变化，最好设置它可以优化性能

:::demo

import { defineComponent } from '@vue/composition-api'
import WScrollbar from '@weier/w-scrollbar'

export default defineComponent({
  setup() {

  },
  render() {
    const n = []
    for (let i = 0; i < 100; i++) {
      n.push(i)
    }
    return (
       <div class="WScrollbar-father" style={{
        height: '200px',
        border: '1px dashed #dedede'
       }}>
        <WScrollbar autoShow={false}>
          <ul class="content" style="width: 120%">
            {
              n.map(index => <li key={index}>{index}</li>)
            }
          </ul>
        </WScrollbar>
      </div>
    )
  }
})

:::

w-scrollbar Attributes

参数	说明	类型	可选值	默认值
zIndex	滚动条层级	Number	——	1
autoShow	是否移入时显示	Boolean	true/false	true
light	滚动条的颜色是否亮色	Boolean	true/false	false
noresize	如果 container 尺寸不会发生变化，最好设置它可以优化性能	Boolean	true/false	false

w-scrollbar Events

事件名称	说明	参数
reach-top	到达顶部	无
reach-bottom	到达底部	无
reach-left	到达最左边	无
reach-right	到达最右边	无
scroll	鼠标滚动时触发	scrollInfo(Object)