需求概述：就是两个日期相减，把得到的天时分秒显示在页面中并实时更新时间走动。
效果：
代码：
代码语言：javascript复制<template>
<h2><span>世界上最甜的崽</span>小甜崽</h2>
<p>网站：ltBlog</p>
<p>邮箱：sunonzj128@qq.com</p>
<p>已运行：{{blogRunTime}}</p>
<img src="../assets/blog/images/wx.png" alt="微信"> </div>
<div class="isgood_news">
</template>
<script>
import {ref,onMounted,onDeactivated} from "vue";
export default {
name: "index",
setup() {
const timer = ref(0)
const blogRunTime = ref()
onMounted(()=>{ //组件挂载时的生命周期执行的方法
timer.value = window.setInterval(function logname() {
let staytimeGap = new Date().getTime() - new Date('2022-05-12 12:00:00').getTime();
let stayDay = Math.floor(staytimeGap/(3600*1000*24));
let leave = staytimeGap%(3600*1000*24);
let stayHour = Math.floor(leave/(3600*1000));
let leave1 = leave%(3600*1000);
let stayMin = Math.floor(leave1/(60*1000));
let leave2 = leave1%(60*1000);
let staySec = Math.floor(leave2/1000);
blogRunTime.value = stayDay "天" stayHour "时" stayMin "分" staySec "秒";
}, 1000);
})
onDeactivated(()=>{ //离开当前组件的生命周期执行的方法
window.clearInterval(timer.value);
})
return {
blogRunTime
};
},
};
</script>
