Vue无缝滚动与前端数据操作实践-CSDN博客

本文链接：https://blog.csdn.net/InternetJava/article/details/120947759

本文介绍了如何在Vue项目中实现无缝滚动效果，利用vue-seamless-scroll组件进行实现。同时，探讨了定时器的使用，包括setInterval和setTimeout的区别，并展示了在定时器中如何正确处理this上下文。此外，讲解了Vue中Class与Style的动态绑定，并推荐了decimal.js库用于前端数据的高精度计算。最后，讨论了在JavaScript中setTimeout可能出现的this指向问题及其解决方法，包括使用闭包和箭头函数来保持正确的上下文。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

1、vue 基于vue-seamless-scroll无缝滚动：https://www.jianshu.com/p/a2a7d3a9cf2b
2、定时器：setInterval（一直执行） setTimeout（只执行一次）

setInterval(this.testOffline, 500)
setTimeout(this.testOffline, 500)

3、Class 与 Style 绑定

<div
  class="static"
  v-bind:class="{ active: isActive, 'text-danger': hasError }"
></div>

4、前端数据操作使用，使用介绍：https://www.npmjs.com/package/decimal.js

decimal.js

5、setTimeout出现is not a function

// 此方式会出现is not a function
setTimeout(function () {
   this.setData({
      index: "1"
   })
}, 3000)

// 使用that代替this
var that = this;
setTimeout(function () {
   that.setData({
      index: "1"
   })
}, 3000)

//例如：
      const that = this
      setTimeout(function () {
        that.$set(that.isWarn, cameraRank, false)
      }, 5000)

// 在es6中 ， 使用箭头函数是不存在这个问题的
setTimeout( () => {
            console.log(this.type + ' says ' + say)
        }, 1000)

https://www.cnblogs.com/fozero/p/7841488.html
当我们使用箭头函数时，函数体内的this对象，就是定义时所在的对象，而不是使用时所在的对象。
并不是因为箭头函数内部有绑定this的机制，实际原因是箭头函数根本没有自己的this，它的this是继承外面的，因此内部的this就是外层代码块的this。

vue使用记录