最近在做一个vue项目,实现了倒计时功能,首先我们要知道对应的步骤
第一步:在data里面定义天时分秒,要加引号,不然会报错
第二步:在布局里写好插值表达式,就可以传值
第三步:在methods里定义一个方法
1、先取一个方法名,我懒得想名字,所以直接取名function()
2、定义系统服务器的时间,以及一个你想要的未来时间,我定义的是2019年7月25日
3、未来时间 - 服务器的时间 = 要显示到浏览器的时间(默认单位是毫秒)
4、所以我们要将显示到浏览器的时间单位转化为各自的单位时间
5、将转化的时间赋值
第四步:mounted()里调用这个方法
第五步:移除倒计时
但是其实一开始并不是用的以上步骤
之前的方法没有第一步,第五步
第二步也不是用插值表达式,而是直接写数字00
第三步是d.innerHTML = day
所以每次一离开页面就会一直报同一个错
我当时写的时候是将这个'd'当作是id名来用的,所以它是可以实现计时器的功能,只不过会一直报上面这个错误
我以为是没有destroyed(),但是加了也没有,试过了很多方法,还是一直报这个错,
然后我灵机一动,想到了要在data()里面定义赋值,ok,那我就加上了第一步,还是报错。。。
然后我给d.innerHTML加上前缀this.,将布局里的数字00删掉,报错。。。
再后来我寻思了一下,好像这个innerHTML在这里有点格格不入啊,而且这个d这么看来应该也不是id名了,所以我就将它们当作是一个新的定义名来用,先是在data()里面定义,然后在布局里写插值表达式,再是赋值,最后移除,终于不报错了!
以上就是我总结出来的vue项目里实现倒计时的方法以及怎么移除倒计时,遇到的问题以及解决方法,语言表达有点差。。。