日历组件

由于移动端项目中需要用到日历组件，网上找了下，没看到几个合适的，就尝试着自己写一个。然后发现也不是很复杂，目前只做了最基本的功能，大家也可以拿去做做二次开发。

如何写一个日历组件

基础效果如下图：

然后可以接受一个起始日期参数start-date，设置日历当前显示的年月。可以监听一个点击事件click-event，回调参数为当前点击的年月日。



<calendar

    @click-event="getDate"

    :start-date="new Date(2015,7)">

</calendar>

然后具体的代码地址在这里:

新手上路，大家多多指教

基于Vue的简单日历组件的更多相关文章

  1. jmGraph：一个基于html5的简单画图组件

    jmGraph:一个基于html5的简单画图组件 特性: 代码书写简单易理解 面向对象的代码结构 对图形控件化 样式抽离 模块化:入seajs实现模块化开发 兼容性:暂只推荐支持html5的浏览器:i ...

  2. vue初学实践之路——vue简单日历组件(1)

    ---恢复内容开始--- 最近做的项目有一个需求,需要有一个日历组件供预定功能使用,之前的代码过于繁琐复杂,所以我采用vue重写了这个组件. npm.vue等等安装. 只是一个简单的日历组件,所以并不 ...

  3. 一款基于Vue的扩展性组件库 VV-UI

    github: https://github.com/VV-UI/VV-UI 演示地址: https://vv-ui.github.io/VV-UI/#/meta-info 1. LoadingBar ...

  4. Vue项目中使用基于Vue.js的移动组件库cube-ui

    cube-ui 是滴滴公司的技术团队基于 Vue.js 实现的精致移动端组件库.很赞,基本场景是够用了,感谢开源!感谢默默奉献的你们. 刚爬完坑,就来总结啦!!希望对需要的朋友有小小的帮助. (一)创 ...

  5. 基于Vue搭建自己的组件库（1）

    本项目演示地址:https://husilang.github.io/zm-ui 项目参考文章:从零开始搭建Vue组件库 VV-UI 项目的初衷是学习怎么封装一个基于Vue的UI组件库,顺便记录每个步 ...

  6. vue实现简单表格组件

    本来想这一周做一个关于vuex的总结的,但是由于朋友反应说还不知道如何用vue去写一个组件,所以在此写写一篇文章来说明下如何去写vue页面或者组件.vue的核心思想就是组件,什么是组件呢?按照我的理解 ...

  7. 基于Vue的小日历（支持按周切换）

      基于Vue的日历小功能,可根据实际开发情况按每年.每月.每周.进行切换 <template> <div class="date"> <!-- 年份 ...

  8. 基于Vue2-Calendar改进的日历组件（含中文使用说明）

    一,前言 我是刚学Vue的菜鸟,在使用过程中需要用到日历控件,由于项目中原来是用jQuery写的,因此用了bootstarp的日历控件,但是配合Vue实在有点蛋疼,不够优雅…… 于是网上搜了好久找到了 ...

  9. GearCase UI - 自己构建一套基于 Vue 的简易开源组件库

    最近 1 ~ 2 月除了开发小程序之外,还一直在继续深入的学习 Vuejs.利用零碎.闲暇的时间整合了一套基于 Vue 的 UI 组件库.命名为 GearCase UI,意为齿轮盒.现在把该项目进行开 ...

随机推荐

  1. qr.update导致的java.lang.NullPointerException空指针异常

    debug以后代码走到了qr.update这一步,再向下走一步就会报错了,内容是java.lang.NullPointerException 最后再三检查发现是SQL语句写错了!,我写的是插入语句是I ...

  2. 017：COM1无法打开

    重新安装系统以后,COM1无法正常打开,重启以后也是如此.到设备管理器下,禁用COM1然后重启可以正常使用.修改COM1为别的COM号,重启以后可以正常使用.用Pcomm控件,打开该串口,错误号是-8 ...

  3. Android开发学习——Volley框架

    转载至: http://blog.csdn.net/guolin_blog/article/details/17482095 一些概念性的东西 大家进入上边链接理解,我贴一下 具体的实现代码: pub ...

  4. jsp中非空判断

    function中uname要和id的值相匹配,但是这样不专业,要显示我的专业性,我将使用document获得name的值来判断是否为空,应为这样是专业的写法,我要时刻记住我是专业的 <scri ...

  5. 三种将list转换为map的方法(传统方法、jdk8 Stream流、guava)

    三种将list转换为map的方法 - jackyrong - ITeye博客:http://jackyrong.iteye.com/blog/2158009

  6. Python3 动手自己写谷歌翻译

    本篇为实现谷歌翻译的功能,在编写的时候以为只是一个接口的问题. 没想到的是每次翻译都会触发一次JS的执行,在请求参数中生成一个tk. 文中tk的实现是复用的网上大神的代码生成tk. 好了,不说了直接看 ...

  7. springmvc 的配置 annotation-config/annotation-drive/ component-scan 区别

    1. <context:annotation-config /> 作用隐式的配置注解的加载类,默认的加载了AutowiredAnnotationBeanPostProcessor(auto ...

  8. addslashes,stripslashes

    官方介绍: (PHP 4, PHP 5) addslashes — 使用反斜线引用字符串 返回字符串,该字符串为了数据库查询语句等的需要在某些字符前加上了反斜线.这些字符是单引号(’).双引号(”). ...

  9. iOS - - JSON 和 XML解析

    JSON 和 XML 一.JSON 1.什么是JSON JSON是一种轻量级的数据格式,一般用于数据交互 服务器返回给客户端的数据,一般都是JSON格式或者XML格式(文件下载除外) 2.JSON的格 ...

  10. QPushButton注册事件过滤器后按钮消失

    版权声明:本文为博主原创文章,转载需要注明出处. RT,代码如下: ui.btn_set->installEventFilter(this); bool MousrHoverTest::even ...