<template><div id="demo"><!-- b标题 --><header class="header"><h1>大数据可视化面板</h1><div class="showTime">当前时间:2020年3月17-0时54分14秒</div></header></div></template><script>import moment from'moment'// 导入模块
moment.locale('zh-cn')// 设置语言 或 moment.lang('zh-cn');exportdefault{data(){return{
dt:''}},
methods:{getDate(){var t =null
t =setTimeout(time,1000)// 開始运行functiontime(){clearTimeout(t)// 清除定时器this.dt =newDate()var y =this.dt.getFullYear()var mt =this.dt.getMonth()+1var day =this.dt.getDate()var h =this.dt.getHours()// 获取时var m =this.dt.getMinutes()// 获取分var s =this.dt.getSeconds()// 获取秒
document.querySelector('.showTime').innerHTML ='当前时间:'+ y +'年'+ mt +'月'+ day +'-'+ h +'时'+ m +'分'+ s +'秒'
t =setTimeout(time,1000)// 设定定时器,循环运行}}},mounted(){this.getDate()}}</script><style scoped>
body {
margin:0;
padding:0;}.header {
position: relative;
height:100px;
background:url("../../assets/images/head_bg.png") no-repeat top center;
background-size:100%100%;}
h1 {
font-size:16px;
color: #fff;
text-align: center;
line-height:80px;}</style>