iView中表格(Table)时间戳的格式化和友好显示

先看看效果图


效果图

data()中columns的render

...
                    render:(h, params) => {
                        return h("div",{
                            attrs:{
                                title:this.$common.formatTime(params.row.time)
                            }
                        },
                        this.$common.describeTime(params.row.time)
                        )
                    },
...

我自己创建了 ./common/index.js

export default{
    //人性化时间显示
    describeTime(timespan){
      timespan = timespan * 1000
      var dateTime = new Date(timespan);
      var year = dateTime.getFullYear();
      var month = dateTime.getMonth() + 1;
      var day = dateTime.getDate();
      var hour = dateTime.getHours();
      var minute = dateTime.getMinutes();
      var now = new Date();
      var now_new = Date.parse(now.toDateString());  //typescript转换写法

      var milliseconds = 0;
      var timeSpanStr;

      milliseconds = now_new - timespan;

      if (milliseconds <= 1000 * 60 * 1) {
        timeSpanStr = 'Just now';
      }
      else if (1000 * 60 * 1 < milliseconds && milliseconds <= 1000 * 60 * 60) {
        timeSpanStr = Math.round((milliseconds / (1000 * 60))) + ' Mins ago';
      }
      else if (1000 * 60 * 60 * 1 < milliseconds && milliseconds <= 1000 * 60 * 60 * 24) {
        timeSpanStr = Math.round(milliseconds / (1000 * 60 * 60)) + ' Hours ago';
      }
      else if (1000 * 60 * 60 * 24 < milliseconds && milliseconds <= 1000 * 60 * 60 * 24 * 15) {
        timeSpanStr = Math.round(milliseconds / (1000 * 60 * 60 * 24)) + ' Days ago';
      }
      else if (milliseconds > 1000 * 60 * 60 * 24 * 15 && year == now.getFullYear()) {
        timeSpanStr = month + '-' + day + ' ' + hour + ':' + minute;
      } else {
        timeSpanStr = year + '-' + month + '-' + day + ' ' + hour + ':' + minute;
      }
      return timeSpanStr;
    },
    //格式化时间戳
    formatTime(timespan) {
        var date = new Date(timespan * 1000);
        var Y = date.getFullYear() + '-';
        var M = (date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1) + '-';
        var D = date.getDate() + ' ';
        var h = date.getHours() + ':';
        var m = date.getMinutes() + ':';
        var s = date.getSeconds();
        if(D < 10){
        D = "0" + D;
        }
        return Y + M + D + h + m + s
    }
}

最后在main.js注册一下就可以用了

//COMMON FUNCTION
import common from './common'
Vue.prototype.$common = common
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

友情链接更多精彩内容