带参数的过滤器|| 过滤器案例：格式化日期|| time.js ||
生活随笔
收集整理的這篇文章主要介紹了
带参数的过滤器|| 过滤器案例：格式化日期|| time.js ||
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
帶參數的過濾器
過濾器案例：格式化日期
<!DOCTYPE html> <html lang="en"> <head><meta charset="UTF-8"><title>Document</title> </head> <body><div id="app"><div>{{date | format('yyyy-MM-dd')}}</div></div><script type="text/javascript" src="js/vue.js"></script><script type="text/javascript">Vue.filter('format', function(value, arg) {if(arg == 'yyyy-MM-dd') {var ret = '';ret += value.getFullYear() + '-' + (value.getMonth() + 1) + '-' + value.getDate();return ret;}return value;})var vm = new Vue({el: '#app',data: {date: new Date()}});</script> </body> </html>time.js?
/** * 對日期進行格式化， * @param date 要格式化的日期 * @param format 進行格式化的模式字符串* 支持的模式字母有： * y:年, * M:年中的月份(1-12), * d:月份中的天(1-31), * h:小時(0-23), * m:分(0-59), * s:秒(0-59), * S:毫秒(0-999),* q:季度(1-4)* @return String* @author yanis.wang* @see http://yaniswang.com/frontend/2013/02/16/dateformat-performance/*/ 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; }<!DOCTYPE html> <html lang="en"> <head><meta charset="UTF-8"><title>Document</title> </head> <body><div id="app"><div>{{date | format('yyyy-MM-dd hh:mm:ss')}}</div></div><script type="text/javascript" src="js/vue.js"></script><script type="text/javascript">Vue.filter('format', function(value, arg) {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;}return dateFormat(value, arg);})var vm = new Vue({el: '#app',data: {date: new Date()}});</script> </body> </html>
總結
以上是生活随笔為你收集整理的带参数的过滤器|| 过滤器案例：格式化日期|| time.js ||的全部內容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： Spring Boot与数据访问
- 下一篇： 生命周期