• 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 日历组件的更多相关文章

  1. Vue日历组件的功能

    本来呢,开开心心的写完了这个功能,然后发现elemeng更新了,增加了日历组件这个功能 我的内心机器奔溃,但是,element的日历组件太简单了,我感觉还是手撸一个吧,毕竟也不是很难 实现了显示农历, ...

  2. vue 日历组件只显示本月和下个月 -- 多选日期

    效果就是上图 代码贴出 1.在components > calander > index.vue <template> <div class="page&quo ...

  3. 一个vue的日历组件

    说明: 1.基于element-ui开发的vue日历组件. 地址 更新: 1.增加value-format指定返回值的格式2.增加头部插槽自定义头部 <ele-calendar > < ...

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

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

  5. vue-calendar 基于 vue 2.0 开发的轻量,高性能日历组件

    vue-calendar-component 基于 vue 2.0 开发的轻量,高性能日历组件 占用内存小,性能好,样式好看,可扩展性强 原生 js 开发,没引入第三方库 Why Github 上很多 ...

  6. Vue文件封装日历组件

    封装就是要具有灵活性,样式自适应,调用的时候传入props就可以变成自己想要的样式. 效果展示网址:https://1963331542.github.io/ 源代码: <template> ...

  7. Vue自定义日历组件

    今天给大家介绍Vue的日历组件,可自定义样式.日历类型及支持扩展,可自定义事件回调.Props数据传输. 线上demo效果 示例 Template: <Calendar :sundayStart ...

  8. 使用ant design vue的日历组件,实现一个简单交易日与非交易日的切换

    使用ant design vue的日历组件,实现一个简单交易日与非交易日的切换 需求: 日历区分交易日.非交易日 可以切换面板查看整年交易日信息 可以在手动调整交易日.非交易日 演示实例 序--使用软 ...

  9. 基于Vue的简单日历组件

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

随机推荐

  1. 题解 洛谷P2503 【[HAOI2006]均分数据】

    看了眼题目和数据范围\(n \leq 20,k \leq 6\)自然想到了\(dfs\)分组求解,主要是被这道题坑自闭过. 然而硬来\(dfs\)肯定会被蜜汁\(T\)掉,因为暴力\(n\)个数所在集 ...

  2. mac pro下安装brew软件包管理工具

    Homebrew简称brew,OSX上的软件包管理工具,在Mac终端可以通过brew安装.更新.卸载软件. 1.打开终端直接输入下面指令回车: ruby -e "$(curl -fsSL h ...

  3. 结构型模式(六) 享元模式(Flyweight)

    一.动机(Motivate) 在软件系统中,采用纯粹对象方案的问题在于大量细粒度的对象会很快充斥在系统中,从而带来很高的运行时代价--主要指内存需求方面的代价.如何在避免大量细粒度对象问题的同时,让外 ...

  4. Django --- ORM表查询

    目录 使用数据库之前的配置工作 单表操作常用的方法 一对多字段的增删改查 多对多字段数据的增删改查 跨表查询 聚合函数 分组查询 F与Q查询 使用数据库之前的配置工作 settings.py中的配置 ...

  5. CUDA并行程序设计 开发环境搭建与远程调试

    课题需要用到GPU加速.目前使用的台式电脑只有核心显卡,而实验室有一台服务器装有NVIDIA GTX980独显.因此,想搭建一个CUDA的开发环境,来实现在台式机上面开发cuda程序,程序在服务器而不 ...

  6. Hadoop2.8 安装

    一.下载Hadoop与java jdk-8u221-linux-x64.tar.gz  Oracle官网下载 hadoop-2.8.5.tar.gz   Hadoop官网下载 二.配置服务期间ssh免 ...

  7. mongodb 副本集的主的选举

    primary的选举依赖于各个实例的优先权重,默认权重都是1 复本集的主挑选权重最高的,权重一样的无法控制谁为主 设置各个实例的优先权重,挑选自己想要的实例为主,只有primary可以更改权重配置 c ...

  8. h5页面滑动卡顿解决方法

    解决方式: 给滚动的元素加样式:-webkit-overflow-scrolling: touch; -webkit-overflow-scrolling(允许独立的滚动区域和触摸回弹) 如果值为au ...

  9. 花样流水灯的verilog实现

    LED(Light emitting diode)发光二极管将电能转化为可见光,正向电压导通,反向电压截止.对于该板子,二极管用低电压导通,其实验原理图为: 所谓流水灯,即让LED像水一样的点亮,从左 ...

  10. StringSequences

    题意: 给出两个长度不超过\(50\)的字符串\(S, T\),每次可以在\(S\)中插入一个字符,把每次操作后的\(S\)写成一个序列,问有多少种不同的序列. 注意到我们可以把\(S\)拆分成一段一 ...