vue 日历组件
- Github 上很多点击弹出日历选择某个时间的组件,却没有找到单纯展示日历并且能点击获取时间的组件
npm i vue-calendar-component --save
cnpm i vue-calendar-component --save //国内镜像
使用
//vue文件中引入
import Calendar from 'vue-calendar-component'; components: {
Calendar
}
<Calendar
v-on:choseDay="clickDay"
v-on:changeMonth="changeDate"
// v-on:isToday="clickToday"
// :markDate=arr // arr=['2018/4/1','2018/4/3'] 标记4月1日和4月3日 简单标记
//:markDateMore=arr // 多种不同的标记
// 第一个标记和第二个标记不能同时使用
// :agoDayHide='1514937600' //某个日期以前的不允许点击 时间戳10位
// :futureDayHide='1525104000' //某个日期以后的不允许点击 时间戳10位
// :sundayStart="true" //默认是周一开始 当是true的时候 是周日开始
></Calendar>
clickDay(data) {
console.log(data); //选中某天
},
changeDate(data) {
console.log(data); //左右点击切换月份
},
clickToday(data) {
console.log(data); // 跳到了本月
}

组件GIT: https://github.com/zwhGithub/vue-calendar
vue 日历组件的更多相关文章
- Vue日历组件的功能
本来呢,开开心心的写完了这个功能,然后发现elemeng更新了,增加了日历组件这个功能 我的内心机器奔溃,但是,element的日历组件太简单了,我感觉还是手撸一个吧,毕竟也不是很难 实现了显示农历, ...
- vue 日历组件只显示本月和下个月 -- 多选日期
效果就是上图 代码贴出 1.在components > calander > index.vue <template> <div class="page&quo ...
- 一个vue的日历组件
说明: 1.基于element-ui开发的vue日历组件. 地址 更新: 1.增加value-format指定返回值的格式2.增加头部插槽自定义头部 <ele-calendar > < ...
- vue初学实践之路——vue简单日历组件(1)
---恢复内容开始--- 最近做的项目有一个需求,需要有一个日历组件供预定功能使用,之前的代码过于繁琐复杂,所以我采用vue重写了这个组件. npm.vue等等安装. 只是一个简单的日历组件,所以并不 ...
- vue-calendar 基于 vue 2.0 开发的轻量,高性能日历组件
vue-calendar-component 基于 vue 2.0 开发的轻量,高性能日历组件 占用内存小,性能好,样式好看,可扩展性强 原生 js 开发,没引入第三方库 Why Github 上很多 ...
- Vue文件封装日历组件
封装就是要具有灵活性,样式自适应,调用的时候传入props就可以变成自己想要的样式. 效果展示网址:https://1963331542.github.io/ 源代码: <template> ...
- Vue自定义日历组件
今天给大家介绍Vue的日历组件,可自定义样式.日历类型及支持扩展,可自定义事件回调.Props数据传输. 线上demo效果 示例 Template: <Calendar :sundayStart ...
- 使用ant design vue的日历组件,实现一个简单交易日与非交易日的切换
使用ant design vue的日历组件,实现一个简单交易日与非交易日的切换 需求: 日历区分交易日.非交易日 可以切换面板查看整年交易日信息 可以在手动调整交易日.非交易日 演示实例 序--使用软 ...
- 基于Vue的简单日历组件
日历组件 由于移动端项目中需要用到日历组件,网上找了下,没看到几个合适的,就尝试着自己写一个.然后发现也不是很复杂,目前只做了最基本的功能,大家也可以拿去做做二次开发. 如何写一个日历组件 基础效果如 ...
随机推荐
- Makefile学习二
今天继续对Makefile进行研究,话不多说,进入正题: make常用内嵌函数: 下面利用上面的知识点来实现一个多级目录的Makefile,如下: 多级目录Makefile: 这个例子的目录结构如下: ...
- 大数据之路week07--day06 (Sqoop 将关系数据库(oracle、mysql、postgresql等)数据与hadoop数据进行转换的工具)
为了方便后面的学习,在学习Hive的过程中先学习一个工具,那就是Sqoop,你会往后机会发现sqoop是我们在学习大数据框架的最简单的框架了. Sqoop是一个用来将Hadoop和关系型数据库中的数据 ...
- C++左移运算符重载
函数定义期望 通过cout<<对象,打印出复数的实部和虚部,这样一来,就需要重载cout类的位移<<运算函数,但是我们并不能拿到cout源码,在visual studio我们看 ...
- 使用Optional优雅处理null
先假设一个场景.如下所示 public class Person { private String name; public Person() { } public Person(String nam ...
- Tensorflow细节-P160-迁移学习
这是一个完整的程序,值得保存 1.对图片进行预处理并保存 import glob import os.path import numpy as np import tensorflow as tf f ...
- django 第五天 自定义标签 静态文件
昨日忘记上传,先预留位置,稍后补上
- zabbix sender
在zabbix中自定义一个虚拟主机,自定义key值,一般运用的是自动发现规则,给清单规则中配置上宏变量,通过py脚本调动zabbixsender模块,给这个主机,host发送一组包含键和宏变量的值,这 ...
- 洛谷 P1807 最长路_NOI导刊2010提高(07) 题解
P1807 最长路_NOI导刊2010提高(07) 题目描述 设G为有n个顶点的有向无环图,G中各顶点的编号为1到n,且当为G中的一条边时有i < j.设w(i,j)为边的长度,请设计算法,计算 ...
- OpenStack Restful API框架介绍
1 pecan框架介绍 1.1 什么是pecan pecan是一个轻量级的python web框架,最主要的特点是提供了简单的配置即可创建一个wsgi对象并提供了基于对象的路由方式. 主要提供的功 ...
- Python3正则表达式
正则表达式是一个特殊的字符序列,他能帮助你方便的检查一个字符串是否与某种模式匹配. re.match函数 re.match尝试从字符串的起始位置匹配一个模式,如果不是起始位置匹配成功的话,matc ...