精华内容
下载资源
问答
  • 整理文档,搜刮出一个vue时间格式化实例代码,稍微整理精简一下做下分享。export function formatDate(date, fmt) {if (/(y+)/.test(fmt)) {fmt = fmt.replace(RegExp.$1, (date.getFullYear() + '').substr(4 - ...

    整理文档,搜刮出一个vue时间格式化实例代码,稍微整理精简一下做下分享。

    export function formatDate(date, fmt) {

    if (/(y+)/.test(fmt)) {

    fmt = fmt.replace(RegExp.$1, (date.getFullYear() + '').substr(4 - RegExp.$1.length));

    }

    let o = {

    'M+': date.getMonth() + 1,

    'd+': date.getDate(),

    'h+': date.getHours(),

    'm+': date.getMinutes(),

    's+': date.getSeconds()

    };

    for (let k in o) {

    if (new RegExp(`(${k})`).test(fmt)) {

    let str = o[k] + '';

    fmt = fmt.replace(RegExp.$1, (RegExp.$1.length === 1) ? str : padLeftZero(str));

    }

    }

    return fmt;

    };

    function padLeftZero(str) {

    return ('00' + str).substr(str.length);

    }

    把上面代码保存为date.js放到你的公共js文件夹中。

    在你的需要格式化时间戳的组件里像下面这样使用:

    {{time | formatDate}}

    import {formatDate} from './common/date.js';

    export default {

    data() {

    return {

    time:1469281964000

    }

    },

    filters: {

    formatDate(time) {

    var date = new Date(time);

    return formatDate(date, yyyy-MM-dd hh:mm);

    }

    }

    }

    以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持我们。

    时间: 2017-06-11

    展开全文
  • vue 时间格式

    万次阅读 2017-08-24 15:29:54
    讲述一下vue时间格式化。

    讲述一下vue时间格式化。


    (一)函数封装(将该函数封装成一个文件,或者加入自己项目的函数库)

    // 这个函数 网上  随处可见,我也是应用了别人的。
    export function formatDate(date, fmt) {
        if (/(y+)/.test(fmt)) {
            fmt = fmt.replace(RegExp.$1, (date.getFullYear() + '').substr(4 - RegExp.$1.length));
        }
        let o = {
            'M+': date.getMonth() + 1,
            'd+': date.getDate(),
            'h+': date.getHours(),
            'm+': date.getMinutes(),
            's+': date.getSeconds()
        };
        for (let k in o) {
            if (new RegExp(`(${k})`).test(fmt)) {
                let str = o[k] + '';
                fmt = fmt.replace(RegExp.$1, (RegExp.$1.length === 1) ? str : padLeftZero(str));
            }
        }
        return fmt;
    };
    
    function padLeftZero(str) {
        return ('00' + str).substr(str.length);
    }
    

    (二)文件引入注意:由于是函数,故名字要和函数的名字一致

    import { formatDate } from '../../unit/index.js'

    (三)添加到过滤器中

    filters: {
        formatDate(time) {
        var date = new Date(time);
        return formatDate(date, 'yyyy-MM-dd');
       }
    },

    (四)使用场景一: 在HTML中使用

    // item.createdate是后台数据~~
    <div class="bottomTimee fz12 c_9a">{{item.createdate | formatDate}}</div>

    (五)使用场景二: 在提交时候使用

    let nowDate = formatDate(new Date(), 'yyyy-MM-dd hh:mm')

    ok了~~~
    时间格式化的,在网上有了很多的函数。本博客所提供的函数也仅仅是其一。

    展开全文
  • 本篇文章主要介绍了vue时间格式化实例代码,这里整理了详细的代码,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
  • Vue 时间格式设置

    2021-03-12 14:43:34
    Vue 时间格式设置 <el-form-item label="办理时间" prop="date"> <el-date-picker v-model="form.date" type="datetime" format="yyyy/MM/dd hh:mm:ss" value-format="yyyy/MM/dd hh:mm:ss" placeholder...

    Vue 时间格式设置

    <el-form-item label="办理时间" prop="date">
    	<el-date-picker v-model="form.date" type="datetime" format="yyyy/MM/dd hh:mm:ss" value-format="yyyy/MM/dd hh:mm:ss" placeholder="办理时间" style="width: 100%"></el-date-picker>
    </el-form-item>

    设置时间格式主要修改 format 和 value-format 就ok

    展开全文
  • 过滤器介绍 官方教程地址:... vue时间格式化 创建Date.js var dateFormat = { padLeftZero: function (str) { return ('00' + str).substr(str.length) }, forma...

    过滤器介绍

    官方教程地址:https://cn.vuejs.org/v2/guide/filters.html

     

    vue时间格式化

    创建Date.js

    
    var dateFormat = {
        padLeftZero: function (str) {
            return ('00' + str).substr(str.length)
        },
        formatDate: function (date, fmt) {
            if (/(y+)/.test(fmt)) {
                fmt = fmt.replace(RegExp.$1, (date.getFullYear() + '').substr(4 - RegExp.$1.length))
            }
            let o = {
                'M+': date.getMonth() + 1,
                'd+': date.getDate(),
                'h+': date.getHours(),
                'm+': date.getMinutes(),
                's+': date.getSeconds()
            }
            for (let k in o) {
                if (new RegExp(`(${k})`).test(fmt)) {
                    let str = o[k] + ''
                    fmt = fmt.replace(RegExp.$1, RegExp.$1.length === 1 ? str : this.padLeftZero(str))
                }
            }
            return fmt
        }
    
    }
    
    
    export default dateFormat;
    
    

    引入Date.js

        import dateFormat from './assets/js/Date'
    

    创建过滤器

       filters: {
             formatDate(time) {
                 let date = new Date(time);
                 return dateFormat.formatDate(date, "yyyy.MM.dd");
             }
         },

    应用过滤器

        <p>{{item.createDate | formatDate}}</p>

     

    展开全文
  • vue 时间格式相互转化 1、转化YYYYMMDDHHMMSS时间格式为YYYY-MM-DD HH:MM:ss export function changeTime(time) { var newtime = '' newtime = time.substring(0, 4) + '-' + time.substring(4, 6) + '-' + time....
  • 关于vue element-ui组件 时间格式转换下载moment.jsnpm install moment --save1,在组件中prop="createTime":formatter="dateFormat"label="创建时间">用 ':formatter' 来绑定 设置时间格式的方法dateForma2,在...
  • 我们在做vue前端项目的时候,如果后端给到的数据是时间戳的形式,我们要把它改成正常时间格式,可以通过以下方法效果:在main.js下加入以下全局函数//自定义时间函数Vue.filter('dateFormat',function(originVal){...
  • Vue.filter('dateFormat', function (originVal) { //dateFormat为自定义函数名 const dt = new Date(originVal) const y = dt.getFullYear() const m = (dt.getMonth() + 1 + '').padStart(2, '0') const d = ...
  • 小记,VUE时间格式化过滤器 在前端获取数据的时候,经常会有时间格式的转换,在JQ中,我们可以获取到具体的某一个时间戳,再进行转换,然后渲染到页面上。可是在vue中,一般都是循环得到一个列表,时间戳一般是这个...
  • 1 首先在vue项目中npm install moment --save2 定义时间格式化全局过滤器在main.js中 导入组件import moment from 'moment'Vue.filter('dateformat', function(dataStr, pattern = 'YYYY-MM-DDHH:mm:ss') {...
  • Vue 时间格式

    万次阅读 2018-08-09 19:21:05
    methods{// 时间格式化 dateFormat:function(time) { var date=new Date(time); var year=date.getFullYear(); /* 在日期格式中,月份是从0开始的,因此要加0 * 使用三元表达式在小于10的前面加0,以达到...
  • vue时间格式

    2021-03-09 17:45:52
    npm引入 npm install moment --save ... Vue.prototype.$moment = moment 在界面中使用 <el-table-column prop="createTime" label="时间" align="center">{{$moment().format('YYYY-MM-
  • vue时间格式化例子

    2021-01-07 09:01:04
    vue格式时间 解决方法: 1.package.json文件添加依赖: "moment": "^2.14.1", 2.组件中引用 import moment from 'moment'; 3.设置过滤器 mounted:function(){ //过滤器 日期格式化,将 mongo 的 utc ...
  • vue时间格式化方法

    2020-10-27 09:59:57
    vue 项目中 使用elementui中的时间选择器时候,我们拿到时间数据不一定是转换后的格式,这时候就需要将时间格式转换后,再向后台传参、请求 直接在methods里定义 dateFormat(time) { let date = new Date(time...
  • methods: {//格式化时间戳formatDate: function (value) {var date = new Date(value);Y = date.getFullYear(),m = date.getMonth() + 1,d = date.getDate(),H = date.getHours(),i = date.getMinutes(),s = date....
  • 在你的需要格式化时间戳的组件里像下面这样使用: {{time | formatDate}} import {formatDate} from './common/date.js'; export default { data() { return { time:1469281964000 } }, filters: { formatDate(time...
  • vue时间格式过滤器

    2020-09-10 14:31:03
    //时间格式化器 Vue.filter('dateFormat',function (original) { const dt = new Date(original); const y = dt.getFullYear(); const m = ( dt.getMonth() + 1 + '').padStart(2,'0'); const d = (dt.get
  • methods: {//格式化时间戳formatdate: function (value) {var date = new date(value);y = date.getfullyear(),m = date.getmonth() + 1,d = date.getdate(),h = date.gethours(),i = date.getminutes(),s = date....
  • vue时间格式的转换

    2020-12-30 11:57:03
    Vue.filter('dateFormat', function (originVal) { const dt = new Date(originVal) const y = dt.getFullYear() const m = (dt.getMonth() + 1 + '').padStart(2, '0') const d = (dt.getDate() + '').pad

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 1,777
精华内容 710
关键字:

vue时间格式

vue 订阅