日历组件

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

如何写一个日历组件

基础效果如下图:

然后可以接受一个起始日期参数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. 洛谷 P3356 火星探险问题 【最大费用最大流】

    输出方案好麻烦啊 拆点,石头的连(i,i',1,1)(i,i',inf,0)表示可以取一次价值1,空地直接连(i,i',inf,0),对于能走到的两个格子(不包括障碍),连接(i',j,inf,0), ...

  2. CF670C Cinema 【离散化+map】

    题意翻译 莫斯科在举办一场重要的有 nn 个不同国家的珂学家参与的国际会议,每个珂学家都只会一种语言.为了方便起见,我们规定一种语言用 11 到 10^9109 的数来描述. 在会议之后的晚上,珂学家 ...

  3. IE兼容之中文汉字请求乱码-network

    IE兼容之中文汉字请求乱码 IE控制台报错: IE网络报错: 解决方法: encodeURI('--- @ -- 子卿 -'); // "---%20@%20--%20%E5%AD%90%E ...

  4. 版本管理工具SVN的使用

    一.安装服务器端和客户端 需要的软件: 1.服务器端:SlikSVN,下载传送门:http://www.sliksvn.com/en/download/ 2.客户端:“乌龟”,下载传送门:http:/ ...

  5. 使用Docker Compose编排微服务

    一般微服务架构会包含若干个微服务,而每个微服务可以有多个实例,如果每个微服务都有手动启停,那么效率就很低.维护量比较大. 所以我们可以使用Docker Compose来轻松.高效地管理容器. 一.安装 ...

  6. Lightoj 1174 - Commandos (bfs)

    题目链接: Lightoj  1174 - Commandos 题目描述: 有一军队秉承做就要做到最好的口号,准备去破坏敌人的军营.他们计划要在敌人的每一个军营里都放置一个炸弹.军营里有充足的士兵,每 ...

  7. _bzoj3224 Tyvj 1728 普通平衡树【Splay】

    传送门:http://www.lydsy.com/JudgeOnline/problem.php?id=3224 保存splay模版 一刻不停写了一个小时多一点,幸好一遍过了!(其实带着freopen ...

  8. Apusic中间件结合MyEclipse进行远程调试记录

    Apusic中间件结合MyEclipse进行远程调试记录. 在金蝶域中正常部署应用. 启动金蝶中间件时使用"startapusic -ds"命令. 在MyEclipse的Run-- ...

  9. 关于minSdkVersion="8" 升级appcompat_v7包主题"Theme.AppCompat.Light"等不存在的问题

    关于minSdkVersion="8" 升级后,又不想用 appcompat_v7包, 那么appcompat_v7主题"Theme.AppCompat.Light&qu ...

  10. [转]Walkthrough: Your First F# Program

    本文转自:http://msdn.microsoft.com/en-us/library/vstudio/dd233160(v=vs.100).aspx   Visual Studio 2010 in ...