usagees6以下es6用法需要webpack环境编译.
具体参考example-src/app.vueimport vue from 'vue' import vueseamlessscroll from 'vue-seamless-scroll' new vue({ components: { vueseamlessscroll } })
普通模式 (script tag)example:
具体参考test/test.html<html> <head> ... </head> <body> <p id="app"> <vue-seamless-scroll></vue-seamless-scroll> </p> <script src="vue.js"></script> <script src="vue-seamless-scroll"></script> <script> new vue({ el: '#app' }) </script> </body> </html>
configure defaultoption () { return { step: 1, //步长 越大滚动速度越快 limitmovenum: 5, //启动无缝滚动最小数据量 this.datalist.length hoverstop: true, //是否启用鼠标hover控制 direction: 1, //1 往上 0 往下 openwatch: true, //开启data实时监听 singleheight: 0, //单条数据高度有值hoverstop关闭 waittime: 1000 //单步停止等待时间 } }
tksvue-seamless-scroll发现bug或者有什么不足望指点,感觉不错点个star吧。
相关推荐：
jquery滚动组件(vticker.js)实现页面动态数据的滚动效果_jquery
基于滚动条位置判断的简单实例_javascript技巧
css实现隐藏滚动条的代码案例
以上就是vue的无缝滚动组件详解的详细内容。