vue日期时间星期显示再页面
今天是
{{nowDate}}
{{nowTime}}
{{nowWeek}}
export default {
data() {
return {
// 时间变量
timer: null,
nowWeek: "",
nowDate: "",
nowTime: "",
};
},
mounted() {
// 调用时间方法
this.timer = setInterval(() => {
this.setNowTimes();
}, 1000);
},
methods: {
setNowTimes() {
//获取当前时间
let myDate = new Date();
let wk = myDate.getDay();
let yy = String(myDate.getFullYear());
let mm = myDate.getMonth() + 1;
let dd = String(
myDate.getDate() < 10 ? "0" + myDate.getDate() : myDate.getDate()
);
let hou = String(
myDate.getHours() < 10 ? "0" + myDate.getHours() : myDate.getHours()
);
let min = String(
myDate.getMinutes() < 10
? "0" + myDate.getMinutes()
: myDate.getMinutes()
);
let sec = String(
myDate.getSeconds() < 10
? "0" + myDate.getSeconds()
: myDate.getSeconds()
);
let weeks = [
"星期日",
"星期一",
"星期二",
"星期三",
"星期四",
"星期五",
"星期六",
];
let week = weeks[wk];
this.nowDate = yy + "年" + mm + "月" + dd + '日';
this.nowTime = hou + ":" + min + ":" + sec;
this.nowWeek = week;
},
},
};
// 时间 总区域
.time {
width: 100%;
height: 50px;
// background-color: #124daf;
background-color: rgba(#124daf, 0.9);
// 时间左边
.time-l {
width: 50%;
height: 100%;
font-size: 14px;
color: #ffffff;
display: flex;
align-items: center;
justify-content: center;
}
// 时间右边
.time-r {
width: 50%;
height: 100%;
}
}
本文来自互联网用户投稿,文章观点仅代表作者本人,不代表本站立场,不承担相关法律责任。如若转载,请注明出处。 如若内容造成侵权/违法违规/事实不符,请点击【内容举报】进行投诉反馈!
