mint-ui 时间插件使用及获取选择值的方法


Posted in Javascript onFebruary 09, 2018

如下所示:

<div > {{pickerValue}}</div>
<mt-datetime-picker
 ref="picker" 每一个都要填上这一条open
 type="time"
 @confirm="handleConfirm" 设置点击确定
 v-model="pickerValue">
</mt-datetime-picker>
data () {
 return {
 pickerValue:null, 定义
methods:{
openPicker() {
 this.$refs.picker.open();设置开始
 },
handleConfirm(){ console.log(this.pickerValue) ;获取值},

转换小时

formatDate(date) {
 const y = date.getFullYear()
 let m = date.getMonth() + 1
 m = m < 10 ? '0' + m : m
 let d = date.getDate()
 d = d < 10 ? ('0' + d) : d
 return y + ' ' + m + ' ' + d
},
handleConfirm(){
 let a = this.pickerValue
 // console.log(a.split(" ")) ;
 this.zheng=this.formatDate(this.$refs.picker.value)
 console.log(this.formatDate(this.$refs.picker.value))
 // console.log(this.value) ;
},

设置当前日期为初始日期

<mt-datetime-picker :startDate="startDate"</mt-datetime-picker>

data(){
 return{
  startDate: new Date(),
 }
}

设置默认值

this.zheng=new Date().getFullYear()+'年'+new Date().getMonth()+1+'月'+new Date().getDate()+'日'

以上这篇mint-ui 时间插件使用及获取选择值的方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
IE JS无提示关闭窗口不提示的方法
Apr 29 Javascript
JavaScript中的变量声明早于赋值分析
Mar 01 Javascript
js jquery验证银行卡号信息正则学习
Jan 21 Javascript
JavaScript 实现的 zip 压缩和解压缩工具包Zip.js使用详解
Dec 14 Javascript
js弹出窗口返回值的简单实例
May 28 Javascript
基于Javascript实现文件实时加载进度的方法
Oct 12 Javascript
js实现小窗口拖拽效果
Dec 03 Javascript
JQuery统计input和textarea文字输入数量(代码分享)
Dec 29 Javascript
Ajax 加载数据 练习代码
Jan 05 Javascript
JS加密插件CryptoJS实现AES加密操作示例
Aug 16 Javascript
手写Spirit防抖函数underscore和节流函数lodash
Mar 22 Javascript
JS前端可扩展的低代码UI框架Sunmao使用详解
Jul 23 Javascript
VUE2 前端实现 静态二级省市联动选择select的示例
Feb 09 #Javascript
尝试自己动手用react来写一个分页组件(小结)
Feb 09 #Javascript
在 React、Vue项目中使用SVG的方法
Feb 09 #Javascript
JavaScript比较同一天的时间大小实例代码
Feb 09 #Javascript
vue2.0.js的多级联动选择器实现方法
Feb 09 #Javascript
使用mint-ui实现省市区三级联动效果的示例代码
Feb 09 #Javascript
vue二级路由设置方法
Feb 09 #Javascript
You might like
菜鸟修复电子管记
2021/03/02 无线电
PHP登录(ajax提交数据和后台校验)实例分享
2016/12/29 PHP
JQuery从头学起第二讲
2010/07/04 Javascript
基于jQuery实现表格数据的动态添加与统计的代码
2011/01/31 Javascript
《JavaScript高级程序设计》阅读笔记(二) ECMAScript中的原始类型
2012/02/27 Javascript
javascript制作的网页侧边弹出框思路及实现代码
2014/05/21 Javascript
点击A元素触发B元素的事件在IE8下会识别成A元素
2014/09/04 Javascript
js添加select下默认的option的value和text的方法
2014/10/19 Javascript
js中document.write的那点事
2014/12/12 Javascript
JavaScript实战之菜单特效
2016/08/16 Javascript
详解微信小程序 template添加绑定事件
2017/06/23 Javascript
简单实现jQuery手风琴效果
2017/08/18 jQuery
vue中如何动态绑定图片,vue中通过data返回图片路径的方法
2018/02/07 Javascript
Angularjs中的$apply及优化使用详解
2018/07/02 Javascript
详解浏览器缓存和webpack缓存配置
2018/07/06 Javascript
Vue.js中使用iView日期选择器并设置开始时间结束时间校验功能
2018/08/12 Javascript
Javascript 之封装(Package)
2018/09/14 Javascript
JavaScript中的&quot;=、==、===&quot;区别讲解
2019/01/22 Javascript
js图数据结构处理 迪杰斯特拉算法代码实例
2019/09/11 Javascript
weui中的picker使用js进行动态绑定数据问题
2019/11/06 Javascript
JavaScript对象属性操作实例解析
2020/02/04 Javascript
[01:31]完美与DOTA2历程
2014/07/31 DOTA
win10下Python3.6安装、配置以及pip安装包教程
2017/10/01 Python
python中利用h5py模块读取h5文件中的主键方法
2018/06/05 Python
python检测文件夹变化,并拷贝有更新的文件到对应目录的方法
2018/10/17 Python
windows下搭建python scrapy爬虫框架步骤
2018/12/23 Python
Spark处理数据排序问题如何避免OOM
2020/05/21 Python
django有哪些好处和优点
2020/09/01 Python
TUMI澳大利亚网站:美国旅行箱包品牌
2017/03/27 全球购物
水利公司纪检监察自我鉴定
2014/02/25 职场文书
竞争上岗实施方案
2014/03/21 职场文书
委托公证书格式
2015/01/26 职场文书
党员考试作弊检讨书1000字
2015/02/16 职场文书
创业计划书之珠宝饰品
2019/08/26 职场文书
Python实现科学占卜 让视频自动打码
2022/04/09 Python
Python可视化神器pyecharts之绘制箱形图
2022/07/07 Python