html

<td>{{serverInfo.serverTime| formatTime('YMDHMS')}}</td>

js

serverTime: new Date().getTime(),
filters: {
// 时间过滤器
formatTime: function(value, type) {
let dataTime = "";
let data = new Date();
data.setTime(value);
let year = data.getFullYear();
let month = data.getMonth() + 1;
let day = data.getDate();
let hour = data.getHours();
let minute = data.getMinutes();
let second = data.getSeconds();
    month < 10 ? (month = "0" + month) : month;
    day < 10 ? (month = "0" + day) : day;
    hour < 10 ? (hour = "0" + hour) : hour;
    minute < 10 ? (minute = "0" + minute) : minute;
    second < 10 ? (second = "0" + second) : second;
if (type == "YMD") {
dataTime = year + "-" + month + "-" + day;
} else if (type == "YMDHMS") {
dataTime =
year +
"-" +
month +
"-" +
day +
" " +
hour +
":" +
minute +
":" +
second;
} else if (type == "HMS") {
dataTime = hour + ":" + minute + ":" + second;
} else if (type == "YM") {
dataTime = year + "-" + month + "-";
}
return dataTime; // 将格式化后的字符串输出到前端显示
}
},

vue2.0 自定义时间过滤器的更多相关文章

  1. Vue2.0如何自定义时间过滤器

    我们知道Vue2.0开始不再支持自带的过滤器,需要我们自己去自定义过滤器,方法如下:           我们可以自己定义一个时间过滤器,在此引用了一个日期处理类库(Moment.js)可以很快的实现 ...

  2. vue2.0 自定义过滤器(filter)实例

    一.过滤器简介 (1)过滤器创建 过滤器的本质 是一个有参数 有返回值的方法 new Vue({ filters:{ myCurrency:function(myInput){ return 处理后的 ...

  3. vue2.0自定义指令

    前面一片文章说了vue2.0过滤器,其实自定义指令跟过滤器非常相似,单就定义方式而言,其与过滤器完全一致,分为局部指令,和全局指令.不过就是filter改为directive的区别. 过滤器一般用于对 ...

  4. CKEditor5 + vue2.0 自定义图片上传、highlight、字体等用法

    因业务需求,要在 vue2.0 的项目里使用富文本编辑器,经过调研多个编辑器,CKEditor5 支持 vue,遂采用.因 CKEditor5 文档比较少,此处记录下引用和一些基本用法. CKEdit ...

  5. vue2.0 自定义过滤器

    2.0中已经废弃了过滤器,需要我们自定义 <div id="app"> {{message|uppercase}} </div> //过滤器 Vue.fil ...

  6. vue2 自定义时间过滤器

    // template {{a | data}} //script data:{   a: Date.now() } filters: {   data:function (input) {

  7. vue2.0自定义指令的使用方法

    感觉2.0好坑啊,自定义指令和1.0完全不一样,并且文档写得也不太清晰,下面是我写得一个demo,希望帮助大家更好地理解自定义指令 <!DOCTYPE html> <html lan ...

  8. vue2.0 自定义 提示框(Toast)组件

    1.自定义 提示框 组件 src / components / Toast / index.js /** * 自定义 提示框( Toast )组件 */ var Toast = {}; var sho ...

  9. vue2.0 自定义 折叠列表(Accordion)组件

    1.自定义  折叠列表 Accordion.vue (1)sass  版本 <!-- 折叠列表 组件 --> <template> <nav :class="$ ...

随机推荐

  1. 一分钟了解spark的调优

    Tuning Spark 数据序列化 内存调优 内存管理概述 确定内存消耗 调整数据结构 序列化 RDD 存储 垃圾收集调整 其他注意事项 并行度水平 减少任务的内存使用 广播大的变量 数据本地化 概 ...

  2. iOS - Foundation相关

    1.NSString         A.创建的方式:            stringWithFormat:格式化字符串  ,创建字符串对象在堆区域            @"jack& ...

  3. OpenSUSE 11 安装Qt5.0,失败,失败,失败,留个坑,以后来填,万一实现了呢

    我又来无耻的写问题来了,这次还真的是没有解决,线留坑吧,万一以后实现了. 同样,这次也是以恶搞网友说听说想在open suse 上面安装5.0版本以后的Qt,自己折腾好几没有成功. 我一想,哎,这不是 ...

  4. Appium_Python_API说明

    Appium_Python_API 1.contexts contexts(self): Returns the contexts within the current session. 返回当前会话 ...

  5. mysql面试常见题目3

    三十六大 冯唐 春水初生, 春林初盛, 春风十里,不如你. 秋风落叶, 秋雨绵绵, 愁心上秋,只为你. 某个员工信息表结构和数据如下: id name dept salary edlevel hire ...

  6. 前端开发工程师 - 02.JavaScript程序设计 - 期末考试

    期末考试客观题 期末考试主观题 https://www.15yan.com/story/aY0HWAQ7oNU/     1(8分) 函数myType用于根据输入参数返回相应的类型信息. 语法如下: ...

  7. Java学习 · 初识 多线程

    多线程 1. 基础概念 a)     程序 Program i.           静态代码,指令集,应用程序执行的蓝本 b)    进程 Process i.           动态概念,正在运 ...

  8. Python基础 之 tuple类-元组 和 dict类-字典

    tuple 元组 一.tuple 类的基本属性 1.元组,有序:元素不可被修改,不能被增加或者删除tuple类 tu = (111,22,33,44) 一般写元组的时候,推荐在最后加入,和类方法进行区 ...

  9. 剑指offer-栈的压入弹出序列21

    题目描述 输入两个整数序列,第一个序列表示栈的压入顺序,请判断第二个序列是否可能为该栈的弹出顺序.假设压入栈的所有数字均不相等.例如序列1,2,3,4,5是某栈的压入顺序,序列4,5,3,2,1是该压 ...

  10. 名人问题 算法解析与Python 实现 O(n) 复杂度 (以Leetcode 277. Find the Celebrity为例)

    1. 题目描述 Problem Description Leetcode 277. Find the Celebrity Suppose you are at a party with n peopl ...