Vue封装移动端日期选择器组件

Project Address

Npm

Github (欢迎star)

View

组件功能在线演示地址 demo(为有更好的体验,请在浏览器上切换到手机模式或在手机上体验)

<img src=”https://user-gold-cdn.xitu.io…;h=686&f=gif&s=667865″>

Build Setup

# install
npm install vuejs-mobile-datepicker --save
// use
import DatePicker from 'vuejs-mobile-datepicker';

export default {
  // ...
  components: {
    DatePicker
  }
  // ...
}

Property

名称 描述 类型 默认值 选项
show-picker-model 控制日期选择器显示隐藏 Boolean false true | false
mark-weekend 是否标记周末日期 Boolean false true | false
language 语言 String “Chinese” “English” | “Chinese”
default-date 默认选择日期 Date new Date()
start-date 日期选择器可选最小日期 Date new Date(‘1900-1-1’)
end-date 日期选择器可选最大日期 Date new Date()
disable-date 设置禁用日期,函数参数为当前日期如(’2018-8-8’),要求返回Boolean类型的值,为true禁用 Function

Method

| 名称 | 描述 | 回调 |
| —- | —- | —- |
| cancel | 点击取消按钮触发 | — |
| confirm | 点击确认按钮触发,回调参数为选中日期如(’2018-8-8’) | — |

More

想了解更多关于该组件插件的源码,请移步到我的博客

评论

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

这个站点使用 Akismet 来减少垃圾评论。了解你的评论数据如何被处理