跑马灯案例

本文介绍了如何使用Vue.js实现跑马灯效果,详细讲解了跑马灯的实现原理,包括开启和停止定时器的操作。同时,文章探讨了箭头函数在Vue.js中的使用场景,通过实例说明了箭头函数如何保留上下文的`this`值。
摘要由CSDN通过智能技术生成

一. 跑马灯案例

(一) . 跑马灯案例的原理:给一个跑点击事件和停点击事件。

1.需要跑的时候开一个定时器setInterval,每次都截取字符串的第一个字符串,放到最后一个字符。

第一种按了跑动,原来的定时器不会动,从新动定时器

clearInterval(this.timeId)

第二种如果有定时器在跑,直接结束

if(this.timeId){ return }

2.停止把定时器的id清空

(二).代码如下:

  <div id="app">

        <button @click='start'>跑</button>

        <butto

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值