zoukankan      html  css  js  c++  java
  • 时间过滤器

    方法一(在单页面中使用)

    //与data() 同级
    		filters:{
    			//设置一个函数来进行过滤
    			formaDate:function(dateStr,pattern = ''){
    				let str=parseInt(dateStr.toString().padEnd(13,'0'));
    				let dt = new Date(str);
    				let yy = dt.getFullYear();
    				// ES2017 引入了字符串补全长度的功能。如果某个字符串不够指定长度,会在头部或尾部补全。padStart()用于头部补全,padEnd()用于尾部补全。
    				let mm = (dt.getMonth() + 1).toString().padStart(2, '0');
    				let dd = dt.getDate().toString().padStart(2, '0');
    				let h = dt.getHours().toString().padStart(2, '0');
    				let m = dt.getMinutes().toString().padStart(2, '0');
    				let s = dt.getSeconds().toString().padStart(2, '0');
    				if (pattern.toLowerCase() === 'yyyy-mm-dd') {
    					return yy + '-' + mm + '-' + dd
    				} else {
    					return yy + '-' + mm + '-' + dd + ' ' + h + ':' + m + ':' + s
    				}
    			},
    		}
    

      使用  {{item.consult_addtime | formaDate('yyyy-mm-dd')}}

    方法二(全局挂载)
    1.创建js文件  filters.js

    // 时间过滤器
    exports.formaDate=(dateStr,pattern = '')=>{
    		let str=parseInt(dateStr.toString().padEnd(13,'0'));
    		let dt = new Date(str);
    		let yy = dt.getFullYear();
    		// ES2017 引入了字符串补全长度的功能。如果某个字符串不够指定长度,会在头部或尾部补全。padStart()用于头部补全,padEnd()用于尾部补全。
    		let mm = (dt.getMonth() + 1).toString().padStart(2, '0');
    		let dd = dt.getDate().toString().padStart(2, '0');
    		let h = dt.getHours().toString().padStart(2, '0');
    		let m = dt.getMinutes().toString().padStart(2, '0');
    		let s = dt.getSeconds().toString().padStart(2, '0');
    		if (pattern.toLowerCase() === 'yyyy-mm-dd') {
    			return yy + '-' + mm + '-' + dd
    		} else {
    			return yy + '-' + mm + '-' + dd + ' ' + h + ':' + m + ':' + s
    		}
    	}
    

     2.在main.js中引入

    import filters from './store/filters.js';

    Object.keys(filters).forEach(k => Vue.filter(k, filters[k]));

    3.使用  {{item.consult_addtime | formaDate('yyyy-mm-dd')}}

  • 相关阅读:
    浅谈ASP.NET核心对象
    介绍ASP.NET服务器控件之视图状态++
    详述Asp.net的加密解密技巧(1)
    详述Asp.net的加密解密技巧(2)
    ASP.NET性能优化之构建自定义文件缓存
    介绍ASP.NET服务器控件之视图状态
    详细介绍ASP.NET的实用技巧
    扩展RBAC用户角色权限设计方案
    String...
    基于XMPP协议的手机多方多端即时通讯方案
  • 原文地址:https://www.cnblogs.com/daifuchao/p/12641176.html
Copyright © 2011-2022 走看看