Vant-UI移动端时间选择框
使用Vant input框时有时需要调用时间选择,时间选择框要结合弹出层使用
<div class="van-cell van-field"> <span class="van-cell__title van-field__label righ">到期日:</span> <div class="van-cell__value"><!--输入框--> <input type="text" class="van-field__control" readonly="readonly" @click="dete()" placeholder="请选择到期日" v-model="duedate"/> </div> <van-popup v-model="show" position='bottom'><!--弹出层--> <van-datetime-picker @confirm="confirm" @cancel="cancel" v-model="currentDate" type="date" /> </van-popup> </div>
需要注意的是,使用自定义弹出层会触发手机自带的软键盘,可以加上 readonly="readonly"阻止软键盘
readonly="readonly"