vant 时间选择的用法

效果如图所示，点击“来访时间”的input框，手机下方出现事件选择器

方法：点击vant-field这个input框，打开vant-pop弹窗,change事件当下拉改变值得时候触发

注意：readonly="readonly"这一属性可以防止ios手机上触发自带键盘和vant组件键盘两个同时出现的情况

<div class="date-time-input-wrap">

<van-field

v-model="userListForm.end_time"

placeholder="选择时间" readonly="readonly"

@click="endTimePop = true"

/>

<van-popup v-model="endTimePop" label="离开时间" position="bottom" :overlay="true">

<van-datetime-picker

v-model="currentDate_end"

type="datetime"

@cancel="endTimePop = false"

@confirm="endTimePop = false"

@change="endTimeChange"

/>

</van-popup>

</div>

methods里：

endTimeChange(e) {

let endTimeArr = e.getValues();//["2019", "03", "22", "17", "28"]

this.userListForm.end_time = `${endTimeArr[0]}-${endTimeArr[1]}-${endTimeArr[2]} ${endTimeArr[3]}:${endTimeArr[4]}:00`

},

就可以得到如：2019-03-22 16:30:00这样的时间显示了