详解vue移动端日期选择组件

 更新时间:2018年02月22日 10:51:59   投稿:laozhang  
小编给大家整理了关于vue移动端日期选择组件的知识点总结,希望能够给读者带来帮助,一起学习参考下。

先给大家分享一下源码:https://github.com/lx544690189/vue-mobile-calendar

Build Setup

# install dependencies
npm install

# build for production with minification
npm run build

Usage

install

npm install vue-mobile-calendar

or:(from the dist folder)

<script src="vue-mobile-calendar.js" type="text/javascript"></script>

Quickstart

import Vue from 'vue'
import Calendar from 'vue-mobile-calendar'

Vue.use(Calendar)
<calendar
 v-model="calendarShow"
 :defaultDate="defaultDate"
 @change="handelChange">
</calendar>

Attributes

option description type default
v-model show/hide the calendar Boolean false
format format date String "yyyy-MM-dd"
defaultDate default selected date Date new Date()
minDate optional minimum date Date null
maxDate optional maximum date Date null
closeByClickmask close by mask Boolean true
month text of month Array ["一月", "二月", "三月", "四月", "五月", "六月", "七月", "八月", "九月", "十月", "十一月", "十二月"]
week text of day Array ["周一", "周二", "周三", "周四", "周五", "周六", "周日"]

Events

event name description parameter of callback
change when date change (date,formatDate)

Reference

framework7

mint-ui

相关文章

  • vue中如何使用vue-baberrage生成弹幕

    vue中如何使用vue-baberrage生成弹幕

    这篇文章主要介绍了vue中如何使用vue-baberrage生成弹幕,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教
    2022-12-12
  • 详解element-ui表格的合并行和列(非常细节)

    详解element-ui表格的合并行和列(非常细节)

    最近在需求中遇到了elementUI合并行,索性给大家整理下,这篇文章主要给大家介绍了关于element-ui表格的合并行和列的相关资料,文中通过实例代码介绍的非常详细,需要的朋友可以参考下
    2023-06-06
  • vue实现商品列表的无限加载思路和步骤详解

    vue实现商品列表的无限加载思路和步骤详解

    这篇文章主要介绍了vue实现商品列表的无限加载思路和步骤详解,基础思路是触底条件满足之后 page++,拉取下一页数据,结合实例代码给大家介绍的非常详细,需要的朋友可以参考下,
    2024-06-06
  • axios前端访问后端携带cookie的代码实例

    axios前端访问后端携带cookie的代码实例

    当用户在网站登录后,服务器会在其浏览器上设置一个包含登录信息的Cookie,通过这个Cookie,服务器能够识别用户是否已登录,文中通过代码介绍的非常详细,需要的朋友可以参考下
    2024-09-09
  • Vue el-table 默认展开某一行的实例

    Vue el-table 默认展开某一行的实例

    这篇文章主要介绍了Vue el-table 默认展开某一行的实例,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教
    2022-08-08
  • 浅谈vue中使用图片懒加载vue-lazyload插件详细指南

    浅谈vue中使用图片懒加载vue-lazyload插件详细指南

    本篇文章主要介绍了浅谈vue中使用图片懒加载vue-lazyload插件详细指南,具有一定的参考价值,感兴趣的小伙伴们可以参考一下。
    2017-10-10
  • Vue3中的常见组件通信之v-model使用详解

    Vue3中的常见组件通信之v-model使用详解

    这篇文章主要介绍了Vue3中的常见组件通信之v-model使用,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教
    2025-04-04
  • Vue3生命周期钩子函数详解

    Vue3生命周期钩子函数详解

    这篇文章主要为大家详细介绍了Vue3生命周期钩子函数,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2022-01-01
  • vue2 使用@vue/composition-api依赖包 编译、打包各种报错问题分析

    vue2 使用@vue/composition-api依赖包 编译、打包各种报错问题分析

    由于package.json 文件中 vue、vue-template-compiler 版本号前面 多了个 ^ 导致实际导入时,node_module中的 vue 版本可能被升级为 2.7.x,这篇文章主要介绍了vue2 使用@vue/composition-api依赖包 编译、打包各种报错问题分析,需要的朋友可以参考下
    2023-01-01
  • 基于 vue-skeleton-webpack-plugin 的骨架屏实战

    基于 vue-skeleton-webpack-plugin 的骨架屏实战

    这篇文章主要介绍了基于 vue-skeleton-webpack-plugin 的骨架屏实战,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2019-08-08

最新评论