[vue-demo]实时时间转换 v-time

创建一个time.js文件:

内容如下

var Time = {
            // 获取当前时间戳
            getUnix: function () {
              var date = new Date();
              return date.getTime();
            },
            // 获取今天0点0分0秒的时间戳
            getTodayUnix: function () {
              var date = new Date();
              date.setHours(0);
              date.setMinutes(0);
              date.setSeconds(0);
              date.setMilliseconds(0);
              return date.getTime();
            },

            // 获取今年1月1日0点0分0秒的时间戳
            getYearUnix: function () {
              var date = new Date();
              date.setMonth(0);
              date.setDate(1);
              date.setHours(0);
              date.setMinutes(0);
              date.setSeconds(0);
              date.setMilliseconds(0);
              return date.getTime();
            },
            // 获取标准年月日
            getLastDate: function(time) {
              var date = new Date(time);
              var month = date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) :
    date.getMonth() + 1;
              var day = date.getDate() < 10 ? '0' + date.getDate() : date.getDate();
              return date.getFullYear() + '-' + month + "-" + day;
            },
            // 转换时间
            getFormatTime: function(timestamp) {
              var now = this.getUnix();            //当前时间戳
              var today = this.getTodayUnix();    //今天0点时间戳
              var year = this.getYearUnix();      //今年0点时间戳
              var timer = (now - timestamp) / 1000;   //转换为秒级时间戳
              var tip = '';
              if (timer <= 0) {
                  tip = ’刚刚’;
              } else if (Math.floor(timer/60) <= 0) {
                  tip = ’刚刚’;
              } else if (timer < 3600) {
                  tip = Math.floor(timer/60) + ’分钟前’;
              } else if (timer >= 3600 && (timestamp - today >= 0) ) {
                  tip = Math.floor(timer/3600) + ’小时前’;
              } else if (timer/86400 <= 31) {
                  tip = Math.ceil(timer/86400) + ’天前’;
              } else {
                  tip = this.getLastDate(timestamp);
              }
              return tip;
          }
        };
//自定义指令 v-time

Vue.directive('time', {
            bind: function (el, binding) {
              el.innerHTML = Time.getFormatTime(binding.value);
              el.__timeout__ = setInterval(function() {
                  el.innerHTML = Time.getFormatTime(binding.value);
              }, 60000);
            },
            unbind: function (el) {
              clearInterval(el.__timeout__);
              delete el.__timeout__;
            }
        });
 

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值