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的移动端日期时间拾取器,大家反应其由于加载过大的插件导致影响调用速度.那么今天我把从网络上搜集到的两个适合移动端应用的日期和时间选择插件分享给大家 ...
随机推荐
- codeforces 701 E. Connecting Universities(树+ 边的贡献)
题目链接:http://codeforces.com/contest/701/problem/E 题意:有n个城市构成一棵树,一个城市最多有一个学校,这n个城市一共2*k个学校,要对这2*k个学校进行 ...
- yzoj P2345 战争 题解
纯数论 30分:纯暴力,直接模拟判断t秒后,判断hp是否小于0 60分: atk>=h,就是一炮一个,那么军队会在min(n,t)秒之后停止攻击,那么总伤害就是a[n+(n-1) +(n-2)+ ...
- 【Swagger】可能是目前最好的 Spring Boot 集成 swagger 的方案
[Swagger]可能是目前最好的Spring Boot集成 swagger 的方案 uname -m 显示机器的处理器架构(2)uname -r 显示正在使用的内核版本dmidecode -q 显示硬件系统部件 - (SMBIOS / DM ...
- Day004_Linux基础_基础命令之tar打包解包
基础命令之 打包,和解包. tar zcvf 打包的参数 tar zcvf /tmp/etc.tar.gz /etc 将/etc/下的文件压缩成一个压缩包 z 通过gzip工具进行压缩 c 表示 ...
- Word 远程调用失败:异常来自 HRESULT:0x800706BE
之前服务器上一直运行正常的,这几天突然报错 “远程过程调用失败. (异常来自 HRESULT:0x800706BE) ” 解决方案:组件服务—我的电脑—属性—COM安全—编辑默认值 添加各种用户权限 ...
- 2018阿里前端 - 认真写下阿里的面筋,祝福大家收到满意的offer(前端向)
作者:叮!阿里offer请查收!链接:https://www.nowcoder.com/discuss/102509来源:牛客网 首先表达一下对阿里面试官的感谢,以及大公司的气魄——没有因为不是科班出 ...
- Unity3D_01_各种寻找GameObject方法
1.GameObject.Find(): 寻找Hierarchy面板中的activie 不为false的游戏对象: 路径如官方事例写法: public class ExampleClass : Mon ...
- Linux防火墙管理
1.临时关闭防火墙 systemctl stop firewalld 2.查看防火墙运行状态 firewall-cmd --state 3.开启防火墙 systemctl start firewall ...
- windows安装mingw和LuaJIT
1,安装mingw64 先下载mingw64压缩包(不建议下载exe安装包,在线安装太慢),地址如下: https://nchc.dl.sourceforge.net/project/mingw-w6 ...
- 基于zepto的移动端日期+时间选择插件