vue-hash-calendar,移动端日期时间选择插件
按照惯例,先上效果图



vue-hash-calendar
- 基于 vue 2.X 开发的日历组件
- 支持手势滑动操作·1
- 原生 js 开发,没引入第三方库
- 上下滑动 切换 周/月 模式
【周模式中】 左右滑动可切换 上一周/下一周
【月模式中】 左右滑动可切换 上一月/下一月
安装使用说明
npm i vue-hash-calendar
// 在入口文件中(main.js),导入组件库
import vueHashCalendar from 'vue-hash-calendar'
// 引入组件CSS样式
import 'vue-hash-calendar/lib/vue-hash-calendar.css'
// 注册组件库
Vue.use(vueHashCalendar)
// 在VUE文件中引入组件
<vue-hash-calendar></vue-hash-calendar>
CDN 方式引入
//在 index.html 加入以下两个 CDN 链接:
js CDN:https://cdn.jsdelivr.net/npm/vue-hash-calendar@1.1.17/lib/vue-hash-calendar.umd.min.js
css CDN: https://cdn.jsdelivr.net/npm/vue-hash-calendar@1.1.17/lib/vue-hash-calendar.css
//然后在 webpack 配置中,加入以下配置。
externals: {
'vue-hash-calendar': 'VueHashCalendar'
},
Demo

或者请用浏览器的手机模式查看:https://www.hxkj.vip/demo/calendar/
-
vue-hash-calendar,移动端日期时间选择插件的更多相关文章
- 基于zepto的移动端日期+时间选择插件
前段时间写了两个移动端的日期选择插件:轻量级移动端日期选择器,本来是为特定的场景中使用的,结果有同学反应不够灵活和强大.虽然我的看法是移动端的界面要尽可能简洁,功能要尽可能简单,但是难免还是会有各种各 ...
- react-hash-calendar,移动端日期时间选择插件
按照惯例,先上效果图 vue 版本同款日历:https://github.com/TangSY/vue-hash-calendar react-hash-calendar 支持手势滑动操作 上下滑动 ...
- 纯原生js移动端日期选择插件
最近在项目上需要使用日期选择插件,由于是移动端的项目,对请求资源还是蛮节约的,可是百度上一搜,诶~全是基于jquery.zepto的,本来类库就很大,特别像mobiscroll这种样式文件一大堆又丑又 ...
- vue3-hash-calendar,一款基于vue3.x开发的移动端日期时间选择组件
在大家的催更下,鸽了一天又一天,vue3-hash-calendar 终于在今天诞生了. 按照惯例,先上效果图 Demo 扫描上方二维码或者请用浏览器的手机模式查看:https://www.hxkj. ...
- Jquery mobiscroll 移动设备(手机)wap日期时间选择插件以及滑动、滚动插件
Jquery Mobiscroll是一个用于触摸设备(Android phones, iPhone, iPad, Galaxy Tab)的日期和时间选择器jQuery插件.以及各种滑动插件 可以让用户 ...
- [转载]Jquery mobiscroll 移动设备(手机)wap日期时间选择插件以及滑动、滚动插件
Jquery Mobiscroll是一个用于触摸设备(Android phones, iPhone, iPad, Galaxy Tab)的日期和时间选择器jQuery插件.以及各种滑动插件 可以让用户 ...
- Jquery mobiscroll 移动设备(手机)wap日期时间选择插件以及滑
$(function () { var currYear = (new Date()).getFullYear(); var opt={}; //opt.date = {preset : 'date' ...
- 纯原生js移动端城市选择插件
接着上一篇纯js移动端日期选择插件,话说今天同事又来咨询省市县联动的效果在移动端中如何实现,还是老样子,百度上一搜,诶~又全是基于jquery.zepto的,更加可恨的是大多数都是PC版的,三个sel ...
- 基于zepto的移动端日期和时间选择控件
前段时间给大家分享过一个基于jQuery Mobile的移动端日期时间拾取器,大家反应其由于加载过大的插件导致影响调用速度.那么今天我把从网络上搜集到的两个适合移动端应用的日期和时间选择插件分享给大家 ...
随机推荐
- 快速幂 HDU 1061 Rightmost Digit *
Rightmost Digit Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 65536/32768 K (Java/Others)T ...
- 常用分享功能.超级简单,qq 微信 新浪微博分享
<div id="share"> <a href="javascript:void(0)" share-type="qzone&qu ...
- Docker竟然还能这么玩?商业级4G代理搭建实战!
时间过得真快,距离这个系列的上一篇文章<商业级4G代理搭建指南[准备篇]>发布的时间已经过了两个星期了,上个星期由于各种琐事缠身,周二开始就没空写文章了,所以就咕咕咕了. 那么在准备篇中, ...
- .Net基础篇_学习笔记_第四天_switch-case02
using System; using System.Collections.Generic; using System.Linq; using System.Text; using System.T ...
- ORACLE SQL语句练习题
--1:选择部门30中的所有员工select * from emp where deptno=30--2:列出所有办事员(clerk) 的姓名.编号和部门编号select empno,ename,de ...
- 巨杉Tech | Hbase迁移至SequoiaDB 实战
背景 在传统银行 IT 架构中,联机交易与统计分析系统往往采用不同的技术与物理设备,通过定期执行的 ETL 将联机交易数据向分析系统中迁移.而作为数据服务资源池,同一份数据可能被不同类型的微服务共享访 ...
- 秒杀活动是否适合O2O生鲜行业的思考
一.命题提出背景 公司是O2O生鲜行业,公司的业务部门提出要做秒杀活动.产品负责人听到后说没意义,秒杀不适合O2O生鲜.(产品负责人据说是阿里出来的P8,后来去微信,去永辉带运营.研发,做大佬,再后来 ...
- ACM讲课之字符串
本次讲课讲全面介绍字符串以及如何使用字符串解决具体问题. 一.什么是字符串 1.如何存储字符串 平时我们使用的变量有很多,int代表整型变量,double代表浮点型变量,char代表字符型变量,那么对 ...
- Springboot+Shiro+Mybatis+mysql
一 .shiro框架 Shiro是Apache 的一个强大且易用的Java安全框架,执行身份验证.授权.密码学和会话管理.Shiro 主要分为两个部分就是认证和授权两部分 1.Subject代表了当前 ...
- Linux 笔记 - 第六章 Linux 磁盘管理
博客地址:http://www.moonxy.com 一.前言 1.1 硬盘 硬盘一般分为 IDE 硬盘.SCSI 硬盘和 SATA 硬盘.在 Linux 中,IDE 接口的设备被称为 hd,SCSI ...
- 基于zepto的移动端日期+时间选择插件