1.在data中定义一个变量,存储时间

data(){
return {
nowTime:''
}
},

2.给定一个div

<div>{{nowTime}}</div>

3.js部分

 //显示当前时间(年月日时分秒)
timeFormate(timeStamp) {
let year = new Date(timeStamp).getFullYear();
let month =new Date(timeStamp).getMonth() + 1 < 10? "0" + (new Date(timeStamp).getMonth() + 1): new Date(timeStamp).getMonth() + 1;
let date =new Date(timeStamp).getDate() < 10? "0" + new Date(timeStamp).getDate(): new Date(timeStamp).getDate();
let hh =new Date(timeStamp).getHours() < 10? "0" + new Date(timeStamp).getHours(): new Date(timeStamp).getHours();
let mm =new Date(timeStamp).getMinutes() < 10? "0" + new Date(timeStamp).getMinutes(): new Date(timeStamp).getMinutes();
let ss =new Date(timeStamp).getSeconds() < 10? "0" + new Date(timeStamp).getSeconds(): new Date(timeStamp).getSeconds();
this.nowTime = year + "年" + month + "月" + date +"日"+" "+hh+":"+mm+':'+ss ;
},
nowTimes(){
this.timeFormate(new Date());
setInterval(this.nowTimes,1000);
this.clear()
},
clear(){
clearInterval(this.nowTimes)
this.nowTimes = null;
}

4.复制粘贴即可用,主要是使用定时器,每秒调用,最后清除定时器,清除函数

在vue项目中显示实时时间(年月日时分秒)的更多相关文章

  1. Swift3.0 iOS获取当前时间 - 年月日时分秒星期

    Swift3.0 iOS获取当前时间 - 年月日时分秒星期func getTimes() -> [Int] { var timers: [Int] = [] // 返回的数组 let calen ...

  2. C#WinForm中显示实时时间:年/月/日 时/分/秒 星期X

    //加载窗体时 string weekstr = ""; private void Form22_Load(object sender, EventArgs e) { this.t ...

  3. sqlserver 获取时间年月日时分秒

    转自:http://blog.itpub.net/14766526/viewspace-1156100/ select GETDATE() as '当前日期',DateName(year,GetDat ...

  4. C#:获取时间年月日时分秒格式

    //获取日期+时间 DateTime.Now.ToString();            // 2008-9-4 20:02:10 DateTime.Now.ToLocalTime().ToStri ...

  5. java 获得当前时间 年月日时分秒 星期几

    <%SimpleDateFormat df = new SimpleDateFormat("yyyy年MM月dd日 HH时mm分ss秒");//设置日期格式SimpleDat ...

  6. js如何获得系统时间年月日时分秒

    javascript 自带有个对象(构造函数),Date().下面是代码: 回答一: var now = new Date();  var nowTime = now.toLocaleString() ...

  7. mssql 格式化字符串 /时间 年月日时分秒

    比如:1 想格式化 000001,100 格式化为000100: 思路是这样的 1000000 +格式化的数字 取后6位: select   right(cast(power(10,6) as var ...

  8. vue 项目中实用的小技巧

    # 在Vue 项目中引入Bootstrap 有时在vue项目中会根据需求引入Bootstrap,而Bootstrap又是依赖于jQuery的,在使用npm按照时,可能会出现一系列的错误 1.安装jQu ...

  9. vue项目中遇到的那些事。

    前言 有好几天没更新文章了.这段实际忙着做了一个vue的项目,从 19 天前开始,到今天刚好 20 天,独立完成. 做vue项目做这个项目一方面能为工作做一些准备,一方面也精进一下技术. 技术栈:vu ...

随机推荐

  1. C++泛化动态数组

    泛化动态数组 动态数组的核心思想是在存储数据时动态的管理数组元素占用的内存,通过调用动态数组的类方法来对数组中的数据进行增删改查操作.最初我们为数组申请10个元素的空间,放我们不断向数组中添加数据时, ...

  2. codewars--js--ten minutes walk

    题目: You live in the city of Cartesia where all roads are laid out in a perfect grid. You arrived ten ...

  3. cesium结合geoserver利用WFS服务实现图层新增(附源码下载)

    前言 cesium 官网的api文档介绍地址cesium官网api,里面详细的介绍 cesium 各个类的介绍,还有就是在线例子:cesium 官网在线例子,这个也是学习 cesium 的好素材. 内 ...

  4. ORACLE ANALYZE使用小结

      ANALYZE的介绍     使用ANALYZE可以收集或删除对象的统计信息.验证对象的结构.标识表或cluster中的行迁移/行链接信息等.官方文档关于ANALYZE功能介绍如下: ·      ...

  5. PHP0026:PHP 博客项目开发3

  6. 5.Python安装依赖(包)模块方法介绍

    1.前提条件 1). 确保已经安装需要的Python版本 2). 确保已经将Python的目录加入到环境变量中 2. Python安装包的几种常用方式 1). pip安装方式(正常在线安装) 2). ...

  7. MongoDB3.4版本新增特性

    先说明一下mongod和mongos的含义:mongod是MongoDB系统的主要后台进程,它处理数据请求.管理数据访问和执行后台管理操作:该命令的命令行选项主要用于测试,在场景操作中,使用配置文件选 ...

  8. Java语言与C++语言区别

    最近有点空闲时间,学习了Java语言.教材<Java简明教程>第四版,清华大学出版社.本人以前有C++基础,所以主要总结下两者区别. 一.基本类型和运算 1.布尔常量,true和false ...

  9. 开启WIndows10 未经身份验证的来宾访问策略以及SMB1

    打开记事本编辑保存至.vbs 以管理员身份运行 Set obj = createobject("wscript.shell") obj.run ("reg add HKL ...

  10. 如何将BroadcastReceiver中的信息传到Activity中

    方法:在BroadcastReceiver中定义一个接口,在Activity中定义一个BroadcastReceiver的对象,采用动态注册,在Activity中定义接口中的方法并通过Broadcas ...