[原]01-iview踩坑-日期控件

iview版本: 3.1.3

问题

在使用iview的日期选择器时,遇到获取的日期有时是ISO日期格式有时是2019-08-31T16:00:00.000Z格式,使用的是如下代码

<DatePicker type="daterange" placement="bottom-end" v-model="formItem.date" placeholder="选择查询日期区间" 
style="width: 200px" >
</DatePicker>

解决方案

应当使用如下方式,不用双向绑定,使用@on-change方法给formItem.date传值,代码如下:

<DatePicker type="daterange" placement="bottom-end" :value="formItem.cdate" placeholder="选择查询日期区间" 
style="width: 100%" @on-change="getDate">
</DatePicker>

getDate (dateTime) {
    this.formItem.cdate = dateTime
}

更好的方案

后来想到了一个更简洁的方案

<DatePicker type="daterange" placement="bottom-end" v-model="formItem.cdate" placeholder="选择查询日期区间" 
style="width: 100%" @on-change="formItem.cdate=$event">
</DatePicker>
分享 提问
comments powered by Disqus