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

然后可以接受一个起始日期参数start-date,设置日历当前显示的年月。可以监听一个点击事件click-event,回调参数为当前点击的年月日。
<calendar
@click-event="getDate"
:start-date="new Date(2015,7)">
</calendar>
然后具体的代码地址在这里:

新手上路,大家多多指教
基于Vue的简单日历组件的更多相关文章
- jmGraph:一个基于html5的简单画图组件
jmGraph:一个基于html5的简单画图组件 特性: 代码书写简单易理解 面向对象的代码结构 对图形控件化 样式抽离 模块化:入seajs实现模块化开发 兼容性:暂只推荐支持html5的浏览器:i ...
- vue初学实践之路——vue简单日历组件(1)
---恢复内容开始--- 最近做的项目有一个需求,需要有一个日历组件供预定功能使用,之前的代码过于繁琐复杂,所以我采用vue重写了这个组件. npm.vue等等安装. 只是一个简单的日历组件,所以并不 ...
- 一款基于Vue的扩展性组件库 VV-UI
github: https://github.com/VV-UI/VV-UI 演示地址: https://vv-ui.github.io/VV-UI/#/meta-info 1. LoadingBar ...
- Vue项目中使用基于Vue.js的移动组件库cube-ui
cube-ui 是滴滴公司的技术团队基于 Vue.js 实现的精致移动端组件库.很赞,基本场景是够用了,感谢开源!感谢默默奉献的你们. 刚爬完坑,就来总结啦!!希望对需要的朋友有小小的帮助. (一)创 ...
- 基于Vue搭建自己的组件库(1)
本项目演示地址:https://husilang.github.io/zm-ui 项目参考文章:从零开始搭建Vue组件库 VV-UI 项目的初衷是学习怎么封装一个基于Vue的UI组件库,顺便记录每个步 ...
- vue实现简单表格组件
本来想这一周做一个关于vuex的总结的,但是由于朋友反应说还不知道如何用vue去写一个组件,所以在此写写一篇文章来说明下如何去写vue页面或者组件.vue的核心思想就是组件,什么是组件呢?按照我的理解 ...
- 基于Vue的小日历(支持按周切换)
基于Vue的日历小功能,可根据实际开发情况按每年.每月.每周.进行切换 <template> <div class="date"> <!-- 年份 ...
- 基于Vue2-Calendar改进的日历组件(含中文使用说明)
一,前言 我是刚学Vue的菜鸟,在使用过程中需要用到日历控件,由于项目中原来是用jQuery写的,因此用了bootstarp的日历控件,但是配合Vue实在有点蛋疼,不够优雅…… 于是网上搜了好久找到了 ...
- GearCase UI - 自己构建一套基于 Vue 的简易开源组件库
最近 1 ~ 2 月除了开发小程序之外,还一直在继续深入的学习 Vuejs.利用零碎.闲暇的时间整合了一套基于 Vue 的 UI 组件库.命名为 GearCase UI,意为齿轮盒.现在把该项目进行开 ...
随机推荐
- 从Oracle9i RMAN全库备份迁移到 Oracle10g
1. 创建以下目录: mkdir -pv $ORACLE_BASE/admin/$ORACLE_SID/{{a,b,c,dp,u}dump,pfile} mkdir -pv $ORACLE_BASE/ ...
- c语言程序设计案例教程(第2版)笔记(五)-软件开发基础知识
零散知识点: 软件的主要特征 软件是一种逻辑产品,而不是有型的物质: 软件需要设计.开发,但不是传统意义上的产品制造: 软件不会磨损,但软件需要维护,即:修改代码或增加模块: 虽然软件行业正在向基于组 ...
- [转]POJ WA/RE指南
"POJ上头的题都是数学题",也不知道是那个家伙胡诌的--但是POJ的要求就是算法通过了也不让你AC.下面本人就这560题的经验,浅谈一下WA/RE了怎么办. 以下内容是扯淡-- ...
- SSH的安装及使用
ssh(secure shell--加密远程登录管理服务器) ,是一种安全的传输协议,主要用于给远程登录会话的数据进行加密,保证数据传输的安全.Ubuntu客户端可以通过SSH访问远程服务器.SSH的 ...
- [CF1109F]Sasha and Algorithm of Silence's Sounds
题意 有一个\(n*m\)的网格,每个格子有一个数,为\(1\)~\(n * m\)的排列 一个区间\((1<=l<=r<=n*m)\)是好的,当且仅当:数值在该区间内的格子,构成一 ...
- 洛谷 P1430 序列取数
如果按照http://www.cnblogs.com/hehe54321/p/loj-1031.html的$O(n^3)$做法去做的话是会T掉的,但是实际上那个做法有优化的空间. 所有操作可以分解为由 ...
- 树莓派 离线安装 apt-get offline
有网络的地方 sudo cp /var/cache/apt/archives/YOUR_PACK_NAME ~/swap/deb/ 没网络的地方 sudo dpkg -i ~/swap/deb/*
- Zclip点击复制内容到剪贴板兼容各浏览器
WEB开发中,要让用户复制页面中的一段代码.URL地址等信息,为了避免用户拖动鼠标再进行右键复制操作而可能出现的差错,我们可以直接在页面中放置一个复制按钮,只需要轻轻一点这个复制按钮,内容将会被复制, ...
- vue-element:文件上传七牛之key和异步的问题
效果图: html 代码: <el-form-item label="Excel文件" :label-width="formLabelWidth" pro ...
- CCF|打酱油|Java
import java.util.Scanner; public class Main { public static void main(String[] args) { Scanner in = ...