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>
      

        

  • 相关阅读:
    对象排序
    MYSQL连不上
    JS读取.properties文件的方法
    Jquery简单使用
    JSP中request获取值
    MYSQL修改字段
    配置文件读取
    spring注解
    Route@简单应用
    MVC客户端验证的小示例
  • 原文地址:https://www.cnblogs.com/dinghaoran/p/11641576.html
Copyright © 2011-2022 走看看