vue-infinite-auto-scroll

基于vue.js的无缝自动滚动的插件，可添加无限数据而不卡顿

内容

• 浏览器兼容性
• 功能特性
• 安装
• 使用
• 案例
• 配置项默认值
• 个别特殊配置项说明
• 历史版本
• 注意
• 贡献

浏览器兼容性

IE	Firefox	Chrome	Safari	iOS	Android
IE9+	✓	✓	✓	✓	✓

功能特性

• 基于requestAnimationFrame实现
• 配置多满足多样需求
• 目前支持上下无缝滚动
• 持续维护迭代
• 可暂停或重新开始

安装

NPM

npm install vue-infinite-auto-scroll --save

使用

// **main.js**
// 1.全局 install
import Vue from 'vue'
import scroll from 'vue-infinite-auto-scroll'
Vue.use(scroll)
 
// 或者你可以自己设置全局注册的组件名 默认注册的组件名是 vue-infinite-auto-scroll
Vue.use(scroll,{componentName: 'vue-infinite-auto-scroll'})
 
// 2.单个.vue文件局部注册
<script>
  import vueInfiniteAutoScroll from 'vue-infinite-auto-scroll'
   export default {
      components: {
        vueInfiniteAutoScroll
      }
   }
</script>

案例

请查看example

online demo

配置项

key	description	default	val
speed	数值越大速度滚动越快	1	Number
force	是否强制滚动，如果为ture，则即使列表小于容器高度，也将循环滚动	false	Number
once	是否只滚动一次	false	Boolean
newFirst	动态新增的数据是否优先显示，为true时将打乱显示的顺序	false	Boolean

个别特殊配置项说明

1.最外层容器需要手动设置width height overflow:hidden

历史版本

See the GitHub 历史版本.

贡献

欢迎给出一些意见和优化，期待你的 Pull Request