• 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. PAT_A1059

    这是一道素数因子分解的问题: 1.先打印素数表出来,以便后期使用,素数表的大小就是10^5级别就可以,因为输入的数是long int(即就是int而已),大小最大21亿(10^10量级的),我们这里素 ...

  2. mysql开发相关

    1.mysql事务原理,特性,事务并发控制2.如何解决高并发场景下的插入重复3.乐观锁和悲观锁4.常用数据库引擎之间区别5.mysql索引6.B-Tree7.mysql索引类型8.什么时候创建索引9. ...

  3. c# 数据类型转换

    隐式转换 byte, short, int, long, fload, double等根据其顺序向后可以隐式自动完成类型的转换,隐式转移的前提是目标类型精度高于源类型,如:short隐式转换为int, ...

  4. TP5.x——initialize()中如何return

    前言 首先在tp框架中initialize中是无法直接通过return来返回任何值的,return并不会造成脚本的中断! 环境:PHP 7.0.4 | TP5.1 说明 initialize方法 首先 ...

  5. maven中profile的使用

    转载:https://blog.csdn.net/java_collect/article/details/83870215 前言       在开发过程中,我们的项目会存在不同的运行环境,比如开发环 ...

  6. RCNN,Fast RCNN,Faster RCNN 的前生今世:(2) R- CNN (3,2,1)

    3.三次IOU  2.2次model run  1,一次深度神经网络 rcnn主要作用就是用于物体检测,就是首先通过selective search 选择2000个候选区域,这些区域中有我们需要的所对 ...

  7. jquery手机触屏滑动拼音字母城市选择器代码

    今天用到城市选择,直接用拼音滑动方式来选择,用的时候引入jquery(个别样式需要自己修改) <div class="yp_indz"><img src=&quo ...

  8. dedecms搜索下拉

    今天公司用dedecms做一个音乐站,要用到下拉标题搜索,我在本地做的一个测试结果 以下是代码部分(ps:二级栏目不用的可以删除代码,如果只调用某一个栏目或者2个栏目可以用typeid='1,2'):

  9. 0907 安装 Pycharm

    Pycharm Professional(专业版)最简单方法破解,亲测有效 简介 PyCharm是由JetBrains打造的一款Python IDE,VS2010的重构插件Resharper就是出自J ...

  10. VS - ActionFilterAttribute

    Global.asax.cs public class MvcApplication : System.Web.HttpApplication { public static void Registe ...