clown-scrollbar

clown-scrollbar是一款自定义滚动条的插件。摘取自element的Scrollbar。

镜像源调整

npm config set registry=https://packages.aliyun.com/61d7f47b6112fe9819dab60a/npm/npm-registry/

也可以使用nrm调整镜像源

# 安装nrm
npm i -g nrm
# 添加 阿里云效仓库源
nrm add aliyx registry=https://packages.aliyun.com/61d7f47b6112fe9819dab60a/npm/npm-registry/
# 使用 阿里云效仓库源
nrm use aliyx

随后需登录npm仓库才允许install。登录的账号密码，见 仓库的 使用指南。

安装

使用 npm/cnpm/yarn/pnpm 等。

# npm
npm i clown-scrollbar -S
# cnpm
cnpm i clown-scrollbar -S
# yarn
yarn add clown-scrollbar -S
# pnpm
pnpm i clown-scrollbar -S

引入

//引入-scrollbar
<template>
  <Scrollbar style="height: 500px;">
    ...content
  </Scrollbar>
</template>
<script>
  import Scrollbar from 'clown-scrollbar'
  import 'clown-scrollbar/style.css'
</script>

Props

| 属性 | 类型 | 描述 | 默认 | | ---- | --- | --- | --- | | native | Boolean | 是否使用原生滚动条 | false | | wrapStyle | String|Array | wrap层的样式 | '' | | wrapClass | String|Array | wrap层的class | '' | | viewClass | String|Array | wiew层的class | '' | | viewStyle | String|Array | wiew层的样式 | '' | | noresize | Boolean | 如果 container 尺寸不会发生变化，最好设置它可以优化性能 | false | | tag | String | 包裹内容所在容器的标签 | 'div'

Methods

方法是组件内部方法，请在 nextTick 后，调用。(一般情况无需调用内部方法)

| 方法名 | 描述 | 参数说明 | | --- | --- | --- | | update | 更新 横向/竖向 滚动条的大小。 | 无 | | handleScroll | 更新 横向/竖向 滚动条的位置 | 无 |

Thank You for Making this useful~