This article example shares the specific code of Vue using filters to format dates for your reference. The specific content is as follows Case RequirementsCase Study 1. View the unfiltered formatted date format Final case effectCodeSet the date display format <div id="app"> <div>{{date }}</div> <div>{{date | format('yyyy-MM-dd')}}</div> <div>{{date | format('yyyy-MM-dd hh:mm:ss')}}</div> <div>{{date | format('yyyy-MM-dd hh:mm:ss:S')}}</div> </div> <script type="text/javascript" src="../js/vue.js"></script> <script type="text/javascript"> // Vue.filter('format', function (value, arg) { // // console.log(arg); // if (arg == 'yyyy-MM-dd') { // var ret = ''; // ret += value.getFullYear() + '-' + (value.getMonth() + 1) + '-' + value.getDate(); // return ret; // } // }) 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, //month "d": date.getDate(), //day "h": date.getHours(), //hours "m": date.getMinutes(), //minutes "s": date.getSeconds(), //seconds "q": Math.floor((date.getMonth() + 3) / 3), //quarter "S": date.getMilliseconds() //milliseconds }; 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> The above is the full content of this article. I hope it will be helpful for everyone’s study. I also hope that everyone will support 123WORDPRESS.COM. You may also be interested in:
|
<<: MySQL 5.7.17 installation and configuration tutorial under Linux (Ubuntu)
>>: Use PSSH to batch manage Linux servers
Table of contents Brief Analysis of MySQL Master-...
Preface The best method may not be the one you ca...
Recently, when I was working on monitoring equipm...
This article example shares the specific code of ...
Text Shadow text-shadow: horizontal offset vertic...
Website compatibility debugging is really annoyin...
When developing a backend management project, it ...
Prerequisites: Docker is already installed 1. Fin...
I wrote a jsp page today. I tried to adjust <di...
Preface If someone asks you "What are the ch...
I have found a lot of online resources on this pro...
1. Download the installation package The installa...
Table of contents Nesting Parent-child component ...
1. Table structure TABLE person id name 1 you 2 Y...
Lambda Expressions Lambda expressions, also known...