一个用vue2.0写的日期控件,可以支持简单的年月日选择。地址:https://github.com/Stevenzwzhai/vue-datepicker。

首先是关于日期对象的使用,基本就是日期的设置(date.setDate())与获取(date.getFullYear(),date.getMonth(),date,getDate())。在这里主要的一点就是根据选择的年和月份去设定当月的天数,使用设定日期,date.setDate(year, month, 0);这里要注意的是,获取哪个月month就是几,day设为零。而获取当前日期时月份要减一,因为在js的Date对象中月份是0~11.

接下来是关于滑动,在这里使用css3的translate3d,由于是用移动端,因此使用3d动画时可以自动开启设备加速,在一定程度上提高性能。这里只要仔细计算没什么大问题,还要要注意边界问题,滑出边界肯定是不行的。另外滑动加一点时间和动画函数可以使得滑动更加美观,我是用来transition-timing-function:ease-out。

这里做的是一个组件,所以自然要把设定的时间返回,就涉及到父子组件通信,vue2.0去掉了dispatch,就用$on和$emit就好。具体使用方法,在官网或者imooc都有。

vue DatePicker vue2.0的日期插件的更多相关文章

  1. vue 专题 vue2.0各大前端移动端ui框架组件展示

    Vue 专题 一个数据驱动的组件,为现代化的 Web 界面而生.具有可扩展的数据绑定机制,原生对象即模型,简洁明了的 API 组件化 UI 构建 多个轻量库搭配使用 请访问链接: https://ww ...

  2. Vue:Vue2.0搭建脚手架

    随着Vue.js越来越火爆,更多的项目都用到Vue进行开发,在实际的开发项目中如何搭建脚手架呢?今天就来跟大家分享一下如何使用vue-cli搭建脚手架. 一.安装node.js 1.进入官网https ...

  3. 基于VUE2.0的分页插件(很好用,很简单)

    基于jQuery的分页插件很多,今天分享一下基于Vue的分页插件pagination.js,该插件使用用感觉很不错,简单不复杂,现将个人使用过程中的方法与遇到的问题以及实例分享出来. 下载解压的主要目 ...

  4. jquery日期插件jquery.datePicker参数

    1.效果图 2.引入JS.CSS文件 jquery-ui.min.css和jquery-ui.min.js文件 Includes: core.js, widget.js, mouse.js, posi ...

  5. vue2.0 vs vue

    vue2.0相比vue1.0 有哪些改变,今天总结了一下 vue2.0组件中 template 不在支持代码片段 //vue1.0组件中template写法 <template> < ...

  6. 采用Vue2.0开发的分页js组件

    2017-11-17 19:14:23 基于jQuery的分页插件相信大家伙已经都用过很多了,今天分享一下基于Vue2.0的分页插件pagination.js 由于项目需求,要求使用 Vue2.0 开 ...

  7. Vue组成和第3方插件

    vue全家桶的成员是:vue-cli,vuex,vue-router,vue-axios(vue2.0). 第三方插件:vue-scroller,vue-lazyload,vue-awesome-sw ...

  8. [js插件]JqueryUI日期插件

    引言 之前使用jqueryUi中的弹出框做了一个可拖拽的弹出登录框,也顺便将里面的常用的日期插件和文本框智能提示插件,也学习了一下. 使用方法 首先在项目中引入以下文件: <!-- 日期插件 默 ...

  9. 为My97DatePicker日期插件设置默认日期

    datepicker.zip 为My97DatePicker日期插件设置默认日期,开始日期为系统日期的前一个月,结束日期为系统日期: 开始日期不能大于结束日期,且都不能大于今天: 开始日期-maxDa ...

随机推荐

  1. 并行计算提升32K*32K点(32位浮点数) FFT计算速度(4核八线程E3处理器)

    对32K*32K的随机数矩阵进行FFT变换,数的格式是32位浮点数.将产生的数据存放在堆上,对每一行数据进行N=32K的FFT,记录32K次fft的时间. 比较串行for循环和并行for循环的运行时间 ...

  2. Docker初体验

    ## Docker初体验 安装 因为我用的是mac,所以安装很简单,下载dmg下来之后拖拽安装即可完成. 需要注意的就是由于之前的docker是基于linux开发,不支持mac,所以就出现了docke ...

  3. shiro-简介

    简介: Apache Shiro 是Java的一个安全(权限)框架. Shiro可以非常容易的开发出足够好的应用,其不仅可以用在JavaSE环境,也可以用在JavaEE环境. Shiro可以完成:认证 ...

  4. underscore 源码解读之 bind 方法的实现

    自从进入七月以来,我的 underscore 源码解读系列 更新缓慢,再这样下去,今年更完的目标似乎要落空,赶紧写一篇压压惊. 前文 跟大家简单介绍了下 ES5 中的 bind 方法以及使用场景(没读 ...

  5. 一个简单oop的changeTab

    好多地方都会用到这样一个效果“点击tab切换内容页”,根据自己的想法实现了一下,写了个简单的插件.以前写代码都是标准的函数式编程,现在觉得面向对象编程看起来比较爽,并且更容易维护,于是就用oop的思想 ...

  6. [转] JAVA读取excel数据(插入oracle数据库)

    原文地址:http://blog.csdn.net/zczzsq/article/details/16803349 本实例做的是读取execl(只能读取.xls的execl,即只能读取03版的),如果 ...

  7. C#-WebForm-★内置对象简介★Request-获取请求对象、Response相应请求对象、Session全局变量(私有)、Cookie全局变量(私有)、Application全局公共变量、ViewState

    内置对象: 1.Request - 获取请求对象 用法:接收传值 protected void Page_Load(object sender, EventArgs e) { TextBox1.Tex ...

  8. 通过iMindMap改善你的工作方式的教程

    对于iMindMap 10,已经介绍了很多新增与改进的功能,你以为已经结束了?其实不然,本文,小编还会继续和你分享它的一个新功能与一个更新功能.这两个功能将在不经意间改善你的工作方式. 多媒体支持 在 ...

  9. Tomcat内存溢出的三种情况及解决办法分析

    Tomcat内存溢出的原因 在生产环境中tomcat内存设置不好很容易出现内存溢出.造成内存溢出是不一样的,当然处理方式也不一样. 这里根据平时遇到的情况和相关资料进行一个总结.常见的一般会有下面三种 ...

  10. 最小生成树---Prim算法和Kruskal算法

    Prim算法 1.概览 普里姆算法(Prim算法),图论中的一种算法,可在加权连通图里搜索最小生成树.意即由此算法搜索到的边子集所构成的树中,不但包括了连通图里的所有顶点(英语:Vertex (gra ...