vue 2.1.3 实时显示当前时间,每秒更新的方法
时间：2022-03-16 09:50:41|栏目：vue|点击： 次
如下所示：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Vue</title>
</head>
<body>
<div id="app">
{{date}}
</div>
<!-- 开发环境版本，包含了用帮助的命令行警告 -->
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
<script type="text/javascript">
var app = new Vue({
el:'#app',
data:{
date: new Date()
},
mounted () {
var _this = this; //声明一个变量指向vue实例this,保证作用域一致
this.timer = setInterval(function() {
_this.date = new Date();//修改数据date
}, 1000);
},
beforeDestroy () {
if(this.timer) {
clearInterval(this.timer);//在vue实例销毁钱，清除我们的定时器
}
}
});
</script>
</body>
</html>
栏 目：vue
下一篇：vue 单页应用和多页应用的优劣
本文标题：vue 2.1.3 实时显示当前时间,每秒更新的方法
本文地址：http://www.codeinn.net/misctech/196301.html
