<!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> <title></title> <script src="../Vue/vue.min.js"></script> </head> <body> <div id="app"> {{date | formateDate}} </div> <script> var padDate = function (value) { return value < 10 ? '0' + value : value; } var app = new Vue( { el: '#app', data: { date:new Date() }, filters://格式化日期格式 { formateDate: function (value) { var date = new Date(value); var year = date.getFullYear(); var month = padDate(date.getMonth() + 1); var day= padDate(date.getDate()); var hours= padDate(date.getHours()); var minutes = padDate (date.getMinutes ()); var seconds = padDate(date.getSeconds()); return year + '-' + month + '-' + day + ' ' + hours+ '：' +minutes+ '：' +seconds; } }, mounted: function () { var _this = this; this.timer = setInterval(function () { _this.date = new Date(); }, 1000); }, beforeDestroy: function () { if (this.timer) { clearInterval(this.timer); } } } ) </script> </body> </html>