[Vue.js] 基础 -- 过滤器(格式化时间)

vue 过滤器 格式时间秒数,js 时间日期格式化 将总秒数转化为 00:00:00 Vue.filter('filterTime',function (value) { let t; if(value > -1){ let hour = Math.floor(value/3600); let min = Math.floor(value/60) % 60; let sec = value % ... 阅读详情

对日期进行格式化

date 要格式化的日期
format 进行格式化的模式字符串

  • 支持的模式字母
    • y : 年
    • M : 年中的月份(1-12)
    • d : 月份中的天(1-31)
    • h : 小时(0-23)
    • m : 分(0-59)
    • s : 秒(0-59)
    • S : 毫秒(0-999)
    • q : 季度(1-4)
function dateFormat(date, format) {
    if (typeof date === "string") {
        var mts = date.match(/(\/Date\((\d+)\)\/)/);
        if (mts && mts.length >= 3) {
            date = parseInt(mts[2]);
        }
    }
    date = new Date(date);
    if (!date || date.toUTCString() == "Invalid Date") {
        return "";
    }
    var map = {
        "M": date.getMonth() + 1, //月份
        "d": date.getDate(), //日
        "h": date.getHours(), //小时
        "m": date.getMinutes(), //分
        "s": date.getSeconds(), //秒
        "q": Math.floor((date.getMonth() + 3) / 3), //季度
        "S": date.getMilliseconds() //毫秒
    };

    format = format.replace(/([yMdhmsqS])+/g, function(all, t) {
        var v = map[t];
        if (v !== undefined) {
            if (all.length > 1) {
                v = '0' + v;
                v = v.substr(v.length - 2);
            }
            return v;
        } else if (t === 'y') {
            return (date.getFullYear() + '').substr(4 - all.length);
        }
        return all;
    });
    return format;
}
time.js:格式化时间戳模块 time.js 格式化时间戳模块 安装 1. bower bower install binnng/time.js --save 2. component component install binnng/time.js --save 3. npm npm install time.js --save 使用 1. 直接引用 <html> [removed][removed] [removed] var time = + new Date; Time(time, "%y年%M月%d日%h时%m分%s秒"); // xxxx年xx月xx日xx时xx分xx秒 Time(time, "%y-%M-%d %h:%m:%s"); //xxxx-xx-xx xx:xx:xx Tim 立即下载

相关推荐

华为MA5620配置宽带及语音实例

华为EPON配置实例1、公共部分和宽带PPPOE部分用串口用户名密码root/mduadminMA5620E>enableMA5620E#configMA5620E(config)#MA5620E(config)#sysnamebigcow/给设备起名字/****之前为公共部一、建vlan和地址bigcow(config)#vlan100...

weixin_33862041的博客 6347

time.js 时间函数库

最近自己写了个时间函数库,虽然还不算完善,但是我能想到的功能基本都实现了。感兴趣的可以看下。 使用 npm install time-operation --save 复制代码文档 一、工具方法 函数: getCurrentTimeStamp() 功能: 获取现在时间戳 输入: 无 输出: 现在时间戳 事例: Time.getCurrentTimeStamp() //1542701124216 ...

weixin_33757911的博客 6396

别再为PT100测温发愁了!手把手教你用ADS1247+STM32搞定高精度温度采集(附完整代码)

本文详细介绍了如何使用ADS1247与STM32构建高精度PT100测温系统,涵盖硬件设计、SPI配置、温度计算及调试技巧。通过24位ADC和内置PGA,实现0.1℃级精度,适用于工业自动化和医疗设备。附完整代码和常见问题解决方案,助你快速掌握高精度温度采集技术。

weixin_42524703的博客 344

【Vue学习笔记】过滤器(filter)格式化时间(时间戳)——用dayjs插件

目录一.实现效果二.去BootCDN下载dayjs插件三.引入dayjs四.代码实现四.总结五.参考 一.实现效果 二.去BootCDN下载dayjs插件 链接: BootCDN 链接: dayjs 三.引入dayjs <script src="../js/dayjs.min.js"></script> 四.代码实现 <div class="root"> <div id="root"> <h2>显示格式

qq_44862029的博客 2439

FCL碰撞检测库在Windows下的编译与配置(MinGW+CMake)

本文详细介绍了在Windows系统下使用MinGW和CMake编译配置FCL碰撞检测库的完整流程。内容涵盖MinGW-w64、CMake的安装与环境配置,关键依赖库Eigen和libccd的安装,以及FCL源码的编译、安装与实战测试。重点解析了CMake配置命令中的关键参数与常见错误解决方案,旨在帮助开发者高效完成FCL在Windows平台的部署,适用于机器人、游戏物理引擎等需要精确碰撞检测的开发场景。

sunny的博客 482

寒假实训笔记day01——认识M4单片机之STM32F405RGT6

认识M4单片机之STM32F405RGT6(含义、规格、参数)

weixin_47200070的博客 8551

Vue.js使用filter自定义过滤器对时间进行格式化(javascript原生写法)

一、自定义date.js /** 对Date的扩展,将 Date 转化为指定格式的String 月(M)、日(d)、12小时(h)、24小时(H)、分(m)、秒(s)、周(E)、季度(q) 可以用 1-2 个占位符 年(y)可以用 1-4 个占位符,毫秒(S)只能用 1 个占位符(是 1-3 位的数字) eg: “yyyy-MM-dd hh:mm:ss.S” ==> 2006-07-0...

weixin_43831302的博客 649

【干货攻略】Oracle报错篇 ORA-01378 磁盘扇区大小不兼容问题

本期将为大家分享“ORA-01378 磁盘扇区大小不兼容”报错的问题解决方案。

PWY13148的专栏 1437

过滤器(格式化日期)

过滤器(格式化日期) 代码如下 <script> /** * 对日期进行格式化, * @param date 要格式化的日期 * @param format 进行格式化的模式字符串 * 支持的模式字母有: * y:年, * M:年中的月份(1-12), * d:月份中的天(1-31), * h:小时(0-23), * m:分(0-59), * s:秒(0-59), * S:毫秒(0-999)

快乐学代码 296

ChatGPT and Claude国内使用站点

这篇博客介绍了不同的AI聊天平台和定价信息,主要对比了ChatGPT和Claude两款产品。文章列出了多个提供聊天服务的AI平台,包括RawChat、ChatGPTPlus、ChatOpens、Wildcard和2233.ai等,并提供了每个平台的网页链接和定价详情。特别关注了Claude平台,介绍了其普通账号与会员账号的不同,以及相关的定价信息。此外,还提到了一些虚拟卡定价和服务细节,为用户选择合适的AI服务提供了多种参考。

nisidjndn的博客 1万+

Claude Code 100个真实案例 - 用AI搭建GIS地理信息系统(地图标注+热力图)

本案例展示如何使用 Claude Code 从零搭建一个完整的 GIS 地理信息系统。我们将使用 Python + Flask 作为后端,Leaflet.js 作为前端地图引擎,实现地图标注、热力图展示、区域绘制、坐标搜索等功能。全程通过与 Claude Code 对话完成,让你感受 AI 在地理信息领域的强大开发能力。

yueyeguzhuo的专栏 113

Vue 过滤器的简单使用---实时显示格式化时间

【代码】Vue 过滤器的简单使用---实时显示格式化时间。

cfgggg12的博客 155

基于YOLOv8的表面裂痕等缺陷检测:深度学习与UI界面的实践

本文详细介绍了如何使用YOLOv8进行表面裂痕等缺陷检测,并结合图形用户界面展示检测结果。通过YOLOv8的强大能力,我们可以实现高效、准确的表面缺陷检测,提升工业产品的质量控制水平。未来,随着深度学习技术和数据集的不断发展,表面缺陷检测的精度和速度将不断提升,应用领域也将进一步拓展。希望本文的实践能够为深度学习在工业检测领域的应用提供一些启示。

YOLO 550

Vue全局过滤器

全局时间的过滤器 // 第一个过滤器 // 将时间戳转为年月日 Vue.filter('dateformat',function(val){ //需要过滤的日期 const date = new Date(val); const year = date.getFullYear(); // 实际月份加1 const month = date.getMonth

webDevelopSnail的博客 629

VB摄像头监控

该VB模块可对摄像头捕获的画面进行录像等,可在创建的窗口进行控制

IEM模型,地表粗糙度模拟

利用微波反演土壤水分时候,利用IEM模型可以实现对随机地表的模拟

Vue-过滤器

Vue-过滤器的简介以及注册全局过滤器、链式调用的使用实践 Demo

问天丶天问 502

锂电池充电器电路设计 里面有电路

锂电池充电器电路设计 里面有电路 3.7V升压到5V电路设计。

Vue,过滤器的了解和使用

定义:对需要显示的数据进行格式化之后进行呈现。 语法: (1)全局的实现方式:Vue.filter(name,callback) (2)局部的实现方式:new Vue{filters:{}} 使用方式: (1){{ xxx | 过滤器名}} (2) v-bind:属性 = "xxx | 过滤器名" 过滤在使用的时候需要注意: (1)过滤器也可以接收额外参数、多个过滤器也可以串联。例如:过滤器可以实现传参的方式:{{time | timeFormater('YYYY_MM_DD') | mySlice

weixin_43228946的博客 237

复分析 阿尔福斯(Ahlfors) 第三版答案 英文

答案分为十章,有部分习题没有答案,全英文复分析阿尔福斯(Ahlfors) 第三版答案

教女朋友学习 vue中的过滤器及其时间格式化

这篇博客讲解自定义vue中的过滤器,并有完整的代码实现。

扬帆向海的博客 2万+

Vue 定义全局过滤器,时间格式化

03品牌列表的全局过滤器.html &lt;!DOCTYPE html&gt; &lt;html lang="en"&gt; &lt;head&gt; &lt;meta charset="UTF-8"&gt; &lt;meta name="viewport" content="width=device-width, initial-scale=1.

mqingo的博客 2167

vue中使用moment.js(时间格式化插件)

安装moment.js npm install moment --save 全局过滤器 main.js中 import moment from 'moment' //定义一个全局过滤器实现日期格式化 Vue.filter('datrfmt',function (input,fmtstring) {//当input为时间戳时,需转为Number类型 // 使用momentjs这个日期...

qq_37899792的博客 1万+

VUE过滤器的使用 vue 时间格式化

过滤器介绍 官方教程地址:https://cn.vuejs.org/v2/guide/filters.html 过滤器常被用于一些文本格式化 我们可以自定义过滤器,可以实现各种各样的功能。 vue时间格式化 创建Date.js var dateFormat = { padLeftZero: function (str) { return ('00'...

趣学程序 1万+

Vue.js中时间的格式化

在Vue.js中并没有对于时间的格式化方法。比如,新建一个Vue文件,然后在页面输出当前时间。 <template> <p>{{shijian}}</p> </template> <script> export default { name:"shijian", data() { return ...

江夏、的博客 2792

VUE过滤器,时间格式化

1. VUE过滤器 使用vue的过滤器:做输出前的最后一步的处理 Vue.js允许自定义过滤器,可被用于一些常见的文本格式化。 过滤器可以用在两个地方:mustache插值(即{{ }})、v-bind表达式 分为全局和私有过滤器 两者用法相同,都是{{ name | 过滤器的名字 }},写法上有区别 1.1 全局过滤器 写在vue实例外面,且必须先定义过滤器,再创建vue实例 vue过滤器的写法 :Vue.filter('过滤器名称',function(data)) 1.2 私有过滤器 写在vu

wakaka112233的博客 657

Vue过滤器使用(格式化时间)

Vue过滤器使用(格式化时间) 在main.js中注册全局过滤器 // 全局注册格式化时间过滤器 Vue.filter('dateFormat', originVal => { const dt = new Date(originVal) const y = dt.getFullYear() const m = (dt.getMonth() + 1 + '').padStart(2, '0') const d = (dt.getDate() + '').padStart(2, '0'

zhengyuantoo的博客 651

vue过滤器--格式化时间

格式化时间 使用vue过滤器 : 全局过滤器 或局部过滤器 操作时间 : 手动操作 使用moment.js操作 使用全局过滤器 自己操作时间 Vue.filter('dateMy',(msg,pat= 'yyyy-mm-dd') => { //addZero函数 封装了填充0的操作 //padStart 是ES5中 填充字符串 str.padStart(填充后的...

北寻北爱 961

如何使用moment.js以及filter实现vue中的时间格式化过滤器

第一步,下载moment,可以通过 npm install moment --save 命令进行下载 第二步,创建 filter 文件,引入 moment 和 vue,代码如下所示: import Vue from 'vue' import moment from 'moment' 第三步,通过 Vue.filter 命令自定义过滤器,创建 date-format 时间格式化过滤器...

浮生离梦的博客 1024
上一篇: [Vue.js] 基础 -- Vue常用特性
下一篇: [Vue.js] 基础 -- 综合案例 -- 图书管理
^ω^奋斗小青年
博客等级 码龄8年 474粉丝 126原创
评论 1
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付:10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值