首先页面引入需要使用的组件

import { DatetimePicker,Toast,Popup,Picker  } from 'mint-ui';

methods部分

openPicker () {
this.$refs.picker.open()
},
handleConfirm (data) {
this.birthday = getDate(data); //获取的时间为时间戳,getdata是自己写的一个转换时间的方法
},

data部分

birthday:"",  //出生日期
startDate: new Date('1968-01-01'),

template页面部分  

<div class="birth">
<span>出生日期</span>
<div @click="openPicker">{{birthday}}</div>
</div>
<div class="datePicker">
<mt-datetime-picker
type="date"
ref="picker"
year-format="{value} 年"
month-format="{value} 月"
date-format="{value} 日"
@confirm="handleConfirm"
:startDate="startDate"
>
</mt-datetime-picker>
</div>

  

VUE2中使用mint-ui,日期选择picker的更多相关文章

  1. asp.net中的时间日期选择控件

    asp.net中的时间日期选择控件 Posted on 2008-07-17 17:37 飛雪飄寒 阅读(22922) 评论(6) 编辑 收藏     在系统中经常需要进行时间日期选择(比如查询时间范 ...

  2. element-ui日期组件DatePicker设置日期选择范围Picker Options

    element-UI提供了DatePicker日期选择器组件,可以让我们很方便的获取到日期,默认的选择是全部的日期都可以选择的,但是很多场景中我们要对日期选择范围做限定,比如出行日期就不能选过去的日期 ...

  3. vue mint ui 手册文档对于墙的恐惧

    http://www.cnblogs.com/smallteeth/p/6901610.html npm 安装 推荐使用 npm 的方式安装,它能更好地和 webpack 打包工具配合使用. npm ...

  4. vue mint ui 手册文档

    npm 安装 推荐使用 npm 的方式安装,它能更好地和 webpack 打包工具配合使用. npm i mint-ui -S CDN 目前可以通过 unpkg.com/mint-ui 获取到最新版本 ...

  5. 支付宝小程序日期选择组件datePicker封装

    github 地址 https://github.com/iocool/antminDatePicker 最近在做支付宝小程序(以下简称小程序)开发,发现小程序的日期选择组件很不好用,比如安卓和IOS ...

  6. JQuery好用的日期选择控件 DatePicker

    近期发现一个很好的基于JQ的前端UI日期选择控件Jquery.DatePicker.js 下载地址:jquery.DatePIcker.js 演示地址:DatePicker - 基于jQuery 1. ...

  7. 页面日期选择控件--jquery ui datepicker 插件

    日期选择插件Datepicker是一个配置灵活的插件,我们可以自定义其展示方式,包括日期格式.语言.限制选择日期范围.添加相关按钮以及其它导航等.官方地址:http://docs.jquery.com ...

  8. 模块:(日期选择)jquery、bootstrap实现日期下拉选择+bootstrap jquery UI自带动画的日期选择器

    一:jquery.bootstrap实现日期下拉选择 点击文本框弹出窗口 弹窗显示日期时间选择下拉 年份取当前年份的前后各5年 天数随年份和月份的变化而变化 点击保存,文本框中显示选中的日期 代码部分 ...

  9. vuetify,vux,Mint UI 等框架的选择

    vuetify: https://vuetifyjs.com/zh-Hans/getting-started/quick-start NutUI:https://github.com/jdf2e/nu ...

随机推荐

  1. luogu3426 [POI2005]SZA-Template 后缀树

    链接 bzoj不能auto https://www.luogu.org/problemnew/show/P3426 思路 这个要求的串一定是S的前缀和S的后缀. 转化一下 建立出来fail树(fail ...

  2. freeswitch编译安装,初探, 以及联合sipgateway, webrtc server的使用场景。

    本文主要记录freeswitch学习过程. 一 安装freeswitch NOTE 以下两种安装方式,再安装的过程中遇到了不少问题,印象比较深刻的就是lua库找到不到这个问题.这个问题发生在make ...

  3. FZOJ P2109 【卡德加的兔子】

    题目描述 卡德加喜欢养兔子.他在达拉然的下水道里放了 $N$ 个兔笼(编号从 $1$ 到 $N$),里面养着他从德拉诺带来的兔子.它们的繁殖遵循斐波那契数列的规律:刚开始时,笼子里有一对刚出生的兔子. ...

  4. frame和bounds有什么不同?

    frame指的是该view在父view坐标系统中的位置和大小.(参照物是他的父坐标系统). bounds指的是该view在他本身的坐标系统中的位置和大小.(参照点是本身的坐标系统).

  5. IOS MVC与MVVM的区别

    MVVM是对胖模型进行的拆分,其本质是给控制器减负,就是把一些弱业务放到VM中去处理. MVC是一切设计的基础,所有新的设计模式都是基于MVC的改进.

  6. 【GO】【sublime】

    1.首先下载GO的安装包:https://golang.org/doc/install#testing 找到上面一个Download超大按钮,找不到的可以不用再看了. 下载完成,安装. 安装成功后,启 ...

  7. Jupyter Notebook插入图片的4种方法

    来自:https://blog.csdn.net/qq_33039859/article/details/78507316 方法1: ![title](img/python.png) Markdown ...

  8. OLAP多维数据库备份

    本人开发了一款OLAP多维数据库备份软件,现将其贡献博客园. 链接: https://pan.baidu.com/s/1oL8xVZfSUiUcvrvohxKVoQ 提取码: nmh5 操作方式: 1 ...

  9. JxBrowser之五:清除cache和cookie以及SSL证书处理

    1.清除cache和cookie //清除cache browser.getCacheStorage().clearCache(); browser.getLocalWebStorage().clea ...

  10. String.format(String format, Object... args)方法详解

    很多次见到同事使用这个方法,同时看到https://blog.csdn.net/qq_27298687/article/details/68921934这位仁兄写的非常仔细,我也记录一下,好加深印象. ...