vue +vant 之时间选择器

https://youzan.github.io/vant/#/zh-CN/intro  vant 地址

原来的博主  https://blog.csdn.net/Miss_liangrm/article/details/100625386    地址

main.js全局引入  也可以额按需引入，具体看文档，这里是全局引入

import Vue from 'vue';
import { DatetimePicker } from 'vant';

Vue.use(DatetimePicker);

 下面是HTML部分

这个涉及到多个地方使用时间选择器，就可以传参，用用一个

                    

                        上次乳汁淤积时间:选择日期
                         
                        
                    

方法部分 methods

  showPopFn(x) {//top
        if(x=="yuji"){
        this.yujiDilog=true
        }
      },
      showPopup() {
        this.yujiDilog = true;
      },
      changeFn() { // 值变化是触发
        this.changeDate = this.currentDate // Tue Sep 08 2020 00:00:00 GMT+0800 (中国标准时间)
      },
      confirmFn(a,index) { // 确定按钮
        if(a=='yuji'){
            this.patientAssessment.babymonMilkDepositForm.lastTimeFeed=this.timeFormat(this.currentDate);
            this.yujiDilog=false
        }
      },
  
       timeFormat(time) { // 时间格式化 2019-09-08
        let year = time.getFullYear();
        let month = time.getMonth() + 1;
        let day = time.getDate();
        let hour = time.getHours();
        let minute = time.getMinutes();
        let second = time.getSeconds();
        return year + '年' + month + '月' + day + '日'+ hour + '时'+ minute + '分'
    },

data 定义的变量

  yujiDilog:false,
  currentDate: new Date(),
  changeDate: new Date(),

如果涉及到表格动态加载，可以用index定义

 if(a=="table"){
            console.log(a,index)
            let tableDate=this.patientAssessment.recoveryUpperLymphForm.upperLymphTable;
            tableDate[index].timeValue=this.timeFormat(this.currentDate);
            this.shows = false;
        }