vant 时间选择的用法
效果如图所示,点击“来访时间”的input框,手机下方出现事件选择器方法:点击vant-field这个input框,打开vant-pop弹窗,change事件当下拉改变值得时候触发注意:readonly="readonly"这一属性可以防止ios手机上触发自带键盘和vant组件键盘两个同时出现的情况<div class="date-ti...
·
效果如图所示,点击“来访时间”的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这样的时间显示了
更多推荐
已为社区贡献1条内容
所有评论(0)