Shulou(Shulou.com)06/03 Report--

This article is about how vue.js implements a list scrolling loop. The editor thinks it is very practical, so share it with you as a reference and follow the editor to have a look.

Vue.js to achieve list rolling loop method: 1, install vue-seamless-scroll;2, introduce vue-seamless-scroll in the file, and configure components; 3, use vue-seamless-scroll.

The operating environment of this paper: windows10 system, vue.js 2.9, thinkpad T480 computer.

First, we need to install vue-seamless-scroll.

Click the link below to view the presentation.

Instance document link

Cnpm install vue-seamless-scroll-save

Then introduce it in the file and configure the component configuration

Import vueSeamlessScroll from 'vue-seamless-scroll'

Finally, just use it, as follows:

{{index+1}} {{item.itemname}} {{item.number}} import vueSeamlessScroll from 'vue-seamless-scroll'export default {data () {}, components: {/ / component vueSeamlessScroll}, computed: {classOption () {return {step: 0.2, / / the larger the number, the faster the scrolling speed limitMoveNum: 2, / / the amount of data to start seamlessly scrolling this.dataList.length hoverStop: true, / / whether to enable rollover stop direction: 1 / / 0 downward 1 up 2 left 3 right openWatch: true, / / enable data real-time monitoring to refresh dom singleHeight: 0, / / height at which single-step movement stops (default 0 is seamless non-stop scrolling) direction = > 0 singleWidth: 0 / / width of stop of single-step motion (default 0 is seamless non-stop rolling) direction = > 2pm 3 waitTime: 1000 / / time of stop of single-step (default 1000ms)},} .seamless-warp {width: Height: calc; overflow: hidden;} Thank you for reading! This is the end of the article on "how to achieve the list scrolling cycle in vue.js". I hope the above content can be of some help to you, so that you can learn more knowledge. if you think the article is good, you can share it for more people to see!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.