Bootstrap

vuejs滚动条_vuescroll-一个基于 vuejs 的虚拟滚动条

Vuescroll

vuescroll 是一个基于 vue.js 2.X虚拟滚动条, 它支持定制滚动条的样式,检测内容尺寸变化、能够使内容分页、支持上拉-刷新,下推加载等诸多特性。

特点

拥有原生滚动条的滚动行为

可以定制滚动条的样式(包括颜色、尺寸、位置、透明度、是否保持显示等)

在模式之间自由切换

能够通过设置滚动动画来平滑地滚动

拉取刷新和推动加载

支持分页模式(每次滑动整个页面)

支持快照模式(每次滑动滚动一个用户定义的距离)

可以检测内容尺寸发生变化

Demo

有两种方式查看 Demo:

打开项目根目录下的 demo 文件夹进行查看

进入官网进行查看

用法

用 npm 或者是 yarn 安装

推荐你用 yarn, 为什么? Yarn 会对你下载的每一个模块进行缓存, 当你下次再用的时候就不会重新下载了。

npm install vuescroll -S

# yarn add vuescroll

在你的入口文件进行配置

import Vue from 'vue'

import vuescroll from 'vuescroll'

Vue.use(vuescroll)

const vm = new Vue({

el: "#app",

data: {

ops: {

vuescroll: {

},

scrollPanel: {

}

<
;