zoukankan      html  css  js  c++  java
  • vue中插值表达式中时间转换yyyy-MM-dd HH:mm:ss

    vue插值表达式中将时间转换两种方式:
    一、定义方法
    <div id="app">当前实时时间:{{dateFormat(date)}}</div>
    
    //时间格式化函数,此处仅针对yyyy-MM-dd hh:mm:ss 的格式进行格式化
    dateFormat(time) {
        var date=new Date(time);
        var year=date.getFullYear();
    /* 在日期格式中,月份是从0开始的,因此要加0
    * 使用三元表达式在小于10的前面加0,以达到格式统一 如 09:11:05
    * */
        var month= date.getMonth()+1<10 ? "0"+(date.getMonth()+1) : date.getMonth()+1;
        var day=date.getDate()<10 ? "0"+date.getDate() : date.getDate();
        var hours=date.getHours()<10 ? "0"+date.getHours() : date.getHours();
        var minutes=date.getMinutes()<10 ? "0"+date.getMinutes() : date.getMinutes();
        var seconds=date.getSeconds()<10 ? "0"+date.getSeconds() : date.getSeconds();
    // 拼接
        return year+"-"+month+"-"+day+" "+hours+":"+minutes+":"+seconds;
    }    
    

      

    二、定义过滤器

    1.   引入moment依赖
      npm install moment --save
      

        

    2. main.js中全局引用并定义过滤器
      import moment from 'moment'
      //全局过滤器
      Vue.filter('dateFmt', (input, formatString = "YYYY-MM-DD") => {
          return moment(input).format(formatString)
      })
      

        

    3. 组件插值表达式中使用
      <div id="app">当前实时时间:{{date|dateFmt('YYYY-MM-DD HH:mm:ss')}}</div>
      

        

  • 相关阅读:
    ZOJ 3018
    poj2464
    Gauss
    【C】关于内存地址
    【C】typedef与define的区别
    C位移操作
    操作系统使用批处理文件更改网络配置
    【Linux】查看某个进程的线程数量(转)
    数据结构快速排序
    C++Explanation of ++val++ and ++*p++ in C
  • 原文地址:https://www.cnblogs.com/dinghaoran/p/11641576.html
Copyright © 2011-2022 走看看