今天在写一个滚动图片的功能,功能是这样的,页面加载后直接开始滚动,鼠标悬停停止滚动,鼠标离开再开始滚动。
原理很简单,就是弄个定时器让元素.scrollLeft不断增加，鼠标移入时清除定时器，鼠标移除恢复定时器。
但是在vue中就出现了一个小问题，在组件上使用@mouseenter="startRoll",@mouseLeave="stopRoll"
然后在methods中写好这两个function
页面mounted后starRoll
那么这个小问题来了,定时器写在哪呢?startRoll里的定时器在stopRoll中并无法停止。
解决方法：
将定时器声明在data内：
先在data内设置一个 timer：null；
在startRoll中： this.timer=setInterval(function(){},20)
在stopRoll中: clearInterval(this.timer);
问题解决!
有点啰嗦,请指教
