<template>
<card>
<label>开始时间</label>
<DatePicker
v-model="startTime"
type="datetime"
:editable="false"
format="yyyy-MM-dd HH:mm"
style="width: 200px"
></DatePicker>
<label>过期时间</label>
<DatePicker
v-model="endTime"
type="datetime"
:editable="false"
format="yyyy-MM-dd HH:mm"
style="width: 200px"
></DatePicker>
</card>
</template>
<script>
export default {
data() {
return {
startTime:"",
endTime:""
}
},
methods: {
// 格式化时间,获取当前时间的一个月后的时间值
convertToLateDate() {
var data = new Date();
var Da = new Date(data.getTime() + 24 * 60 * 60 * 1000 * 30);
// 以上两行代码为关键代码,若想要返回一天后的时间,则可以将第二行代码更换为下面代码
// var Da = new Date(data.getTime() + 24 * 60 * 60 * 1000);
// 若是想要返回值为当前时间,则上面两行代码可以直接修改为下面代码即可。
// var Da = new Date()
var y = Da.getFullYear();
var m = Da.getMonth() + 1;
var d = Da.getDate();
var H = Da.getHours();
var mm = Da.getMinutes();
m = m < 10 ? "0" + m : m;
d = d < 10 ? "0" + d : d;
H = H < 10 ? "0" + H : H;
return y + "-" + m + "-" + d + " " + H + ":" + mm;
}
},
// 页面加载完毕后触发的事件
mounted() {
var vm = this;
vm.startTime = new Date();// 默认显示为当天时间
vm.endTime = vm.convertToLateDate();
}
}
</script>

vue中在时间输入框中默认显示时间的更多相关文章

  1. jquery easyui datebox 时间控件默认显示当前日期的实现方法

    jquery easyui datebox 时间控件默认显示当前日期的实现方法 直接class easyui-datebox后添加一个value="true"就可以

  2. HTML输入框的默认显示内容

    在某些情况下我们会需要在输入框里默认显示一些内容,比如在登录的时候不在输入框前面显示用户名和密码,直接在输入框里显示,这时只要在input的标签里添加属性  placeholder="用户名 ...

  3. ASP.net中GridView中增加一行记录并默认显示为编辑状态

    //添加 protected void Button1_Click(object sender, EventArgs e) { DataSet ds = (DataSet)pa.GetDataSet( ...

  4. 在ie10中如何禁用输入框中的小眼睛 与 叉叉 删除按钮

    修改本地组策略,禁用密码输入框中的密码显示: 切换成IE兼容模式:(此方法仅在Windows 7下有效,Windows 8无效) 那是系统自己支持的,有时候很方便,有时候会影响文本框里的文本,提供一个 ...

  5. JS中通过Input中id获取输入框中的值

    HTML中 <input type="text" id="ONE" oninput="kpi()"> JS中 function ...

  6. js中过滤在输入框中过滤掉特殊表情

    在页面输入text 时,经常会出现某些特殊符号例如:❤

  7. Spring Boot程序插入时间和MySQL数据库显示时间不一样(设置数据库时区)

    首先查看数据库时区 show variables like "%time_zone%"; # 设置全局时区 mysql> set global time_zone = '+8 ...

  8. C#数据绑定中,时间为空时显示时间为原始日期问题

    这个问题一般出现在用实体时,实体的时间格式没有加?号.加了之后就默认为空,没有数据时不会为原始时间了.

  9. Android中通过反射来设置Toast的显示时间

    这个Toast的显示在Android中的用途还是非常大的,同一时候我们也知道toast显示的时间是不可控的.我们仅仅能改动他的显示样式和显示的位置,尽管他提供了一个显示时间的设置方法.可是那是没有效果 ...

随机推荐

  1. 使用Nginx搭建Tomcat9集群,Redis实现Session共享

    使用Nginx搭建Tomcat9集群,Redis实现Session共享 1.tomcat准备 首先准备两个tomcat9 ,修改配置文件server.xml 如果在多个服务器上分别启动tomcat 则 ...

  2. reduce()、filter()、map()、some()、every()、...展开属性

    reduce().filter().map().some().every()....展开属性   这些概念属于es5.es6中的语法,跟react+redux并没有什么联系,我们直接在https:// ...

  3. 爬虫(十七):Scrapy框架(四) 对接selenium爬取京东商品数据

    1. Scrapy对接Selenium Scrapy抓取页面的方式和requests库类似,都是直接模拟HTTP请求,而Scrapy也不能抓取JavaScript动态谊染的页面.在前面的博客中抓取Ja ...

  4. Compare/ContrastEssay你真的会写了吗?

    Compare/Contrast Essay也是留学生们常遇到的一种作业类型,但是很多留学生不知道怎么写.本文HotEssay为大家整理了Compare/Contrast Essay写作方法,希望对大 ...

  5. 《thinkphp》二、创建实例

    1.目录结构 project 应用部署目录 ├─application 应用目录(可设置) │ ├─common 公共模块目录(可更改) │ ├─index 模块目录(可更改) │ │ ├─confi ...

  6. RPC——看这一篇就…显然不够

    引言 RPC blablabla…… RPC 知识点 扩展 有给老婆解释的如:https://www.jianshu.com/p/2accc2840a1b

  7. 基础语法-循环结构do...while

    基础语法-循环结构do...while 作者:尹正杰 版权声明:原创作品,谢绝转载!否则将追究法律责任. 一.do...while语句格式 do{ 执行语句; }while(条件表达式); 温馨提示: ...

  8. 数据结构顺序表中Sqlist *L,&L,Sqlist *&L

    //定义顺序表L的结构体 typedef struct { Elemtype data[MaxSize]: int length; }SqList; //建立顺序表 void CreateList(S ...

  9. C语言预处理理论2

    C语言预处理理论1.头文件包含(1)#include <>和#include ""区别:<>专门用来包含系统提供的头文件(就是系统自带的,不是程序员自己写的 ...

  10. BZOJ 3442 学习小组

    题解: 神建图 普通的二分图费用流建完后 添加学生x->t 容量为k-1的边 表示尽量让x参加一个活动,剩下的k-1次机会可以不参加 #include<iostream> #incl ...