首页 > 其他分享 >Vue.js在网页上显示当前时间

Vue.js在网页上显示当前时间

时间:2022-12-05 09:22:27浏览次数:36  
标签:Vue 网页 timer js date Date new

Vue.js在网页上显示当前时间:

在<template>里添加

<div>{{date}}</div>
在<script>里添加
export default {
  data () {    
      date: new Date(new Date().getTime() + 8*3600*1000).toJSON().substr(0, 19).replace('T', ' ')
  },
  mounted() {
    let _this = this;
    this.timer = setInterval(() => {
      _this.date = new Date(new Date().getTime() + 8*3600*1000).toJSON().substr(0, 19).replace('T', ' ')
    }, 1000)
  },
  beforeDestroy() {
    if (this.timer) {
      clearInterval(this.timer);
    }
  }
}

效果:

 

标签:Vue,网页,timer,js,date,Date,new
From: https://www.cnblogs.com/yellow3gold/p/16951446.html

相关文章

  • Nodejs与工程化开发
    Node原生基础Node基础概念、NPM命令、V8引擎概念、JavaScript模块化CMDAMDUMD、EventLoop事件循环、同步异步、阻塞非阻塞、任务队列、宏任务、微任务、原生Node模......
  • Vue框架
    vue基础vue开发准备、工具与插件、mvcmvpmvvm设计理念、原生js实现MVVM核心框架、vue设计模式、生命周期、命令与属性、组件化数据驱动与双向绑定、虚拟DOM概念原理......
  • Node.js躬行记(25)——Web自动化测试
    网页在提测流转给QA后,如何能帮他们更有效而准确的完成测试,是我一直在思考的一个问题。QA他们会对网页编写测试用例,在提测之前会让我们将优先级最高的用例跑通,......
  • 03#JS 工具函数:正则表达式匹配字符,替换该字符,支持多个正则表达式替换
    /***替换字符串,默认替换""。传递regExps,一个正则表达式数组。**@paramsource被修剪的字符串*@paramregExps正则表达式,找到匹配的字符串,然后替换掉*@pa......
  • 转 Vue插槽有什么作用?
      vue解惑之slot(插槽) 一.插槽是个什么玩意,能吃吗在vue中【插槽】,从字面意思来看,插槽意味着【内容的增加】,回到vue的使用场景,插槽就是【父组件调用子组件时,额......
  • leetcode 101. 对称二叉树 js实现
    给你一个二叉树的根节点 root ,检查它是否轴对称。示例1:输入:root=[1,2,2,3,4,4,3]输出:true示例2:输入:root=[1,2,2,null,3,null,3]输出:false 提示:树......
  • 转 Vue生命周期函数详解
     https://blog.csdn.net/wen110898/article/details/120520844?spm=1001.2101.3001.6650.1&utm_medium=distribute.pc_relevant.none-task-blog-2~default~CTRLIST~Rate-......
  • 转 vue的钩子函数-生命周期
    vue的钩子函数-生命周期 播报文章原创|浏览:273|更新:2020-11-0716:391234567分步阅读所为生命周期顾名思义即是一个物质......
  • JS中的 || 与 && 运算符详解
    1、JS中的||符号:运算方法:只要“||”前面为false,不管“||”后面是true还是false,都返回“||”后面的值。只要“||”前面为true,不管“||”后面是true还是false,都......
  • Vue的基础知识
    作为后端程序员,了解和掌握一些前端知识也是必不可少的,本章就和大家分享Vue的一些基础知识,希望能够对Vue小白有所帮助。话不多说,下面我们直接进入主题。一、Vue简介Vue简......