美文网首页
van-count-down 倒计时相关问题

van-count-down 倒计时相关问题

作者: 攻城狮_前端程序媛 | 来源:发表于2021-08-08 15:26 被阅读0次
1. 倒计时重置问题
  • 背景:业务需要在开启倒计时、暂停、恢复倒计时实时判断是否展示倒计时,并重置倒计时

  • 问题:直接修改this.countDownTime = message.countNum, 倒计时重置并不会有什么用,依然是按照旧的倒计时时间进行--


    倒计时代码.png
  • 解决方法:
    -- 思路1: 按照官方文档 this.$refs.countDown.reset()

 在重置接收到长链接推送时,this.countDownTime = message.countNum,
  this.$refs.countDown.reset()
  但是会报this.$refs.countDow  undefined的错误

-- 思路2: 考虑到vue虚拟DOM及模版渲染的问题,

在this.$nextTick 回调函数中 this.$refs.countDown.reset()
结果是依然报错

-- 终极解决方案:

在判断倒计时是否展示的方法中,在倒计时显示为真的判断中使用this.$nextTick回调函数this.$refs.countDown.reset()
2. 修改倒计时样式
  • 背景: 修改了倒计时文字大小,在pc端看一切正常,但是在手机上就出现了如下图问题
  • 解决方法: 在修改font-size时,同步修改line-hieght
修改了倒计时样式出现的问题.png

相关文章

  • van-count-down 倒计时相关问题

    1. 倒计时重置问题 背景:业务需要在开启倒计时、暂停、恢复倒计时实时判断是否展示倒计时,并重置倒计时 问题:直接...

  • this 相关问题

    问题1: apply、call 、bind有什么作用,什么区别 apply call bind 问题2: 以下代码...

  • this相关问题

    this 相关问题 1: apply、call 、bind有什么作用,什么区别 apply执行一个函数,传入函数执...

  • this相关问题

    1、apply、call、bind有什么作用,什么区别? bind Function.prototype.bind...

  • 相关问题

    电子银行我行手机银行现可提升转账额度为30万(单笔/日均),需要在usb key网银里设置定向转账收款人。手机具备...

  • this相关问题

    apply、call 、bind有什么作用,什么区别 回答这三个方法均可以改变调用函数的this指向 call()...

  • 关于iOS中由于 NSTimer 没有办法内存释放的问题的原理

    关于iOS中由于 NSTimer 没有办法内存释放的问题的原理 先看一下相关的倒计时代码 看到如上的代码,这是从公...

  • tableView相关问题问题

    一、tableView刷新数据后的偏移量问题 在初始化tableView时对预算高度设置如下即可解决: 二、获取t...

  • Android 启动页倒计时自定义view实现

    适用于启动页的几秒倒计时进入主页使用: 使用: 然后代码设置相关属性,开始倒计时: 效果图:

  • 列表中使用倒计时存在问题

    列表中使用倒计时存在问题

网友评论

      本文标题:van-count-down 倒计时相关问题

      本文链接:https://www.haomeiwen.com/subject/eilovltx.html