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"

 

posted @ 2019-05-06 10:56  起啥名嘞  阅读(2175)  评论(0编辑  收藏  举报