element时间范围选择器使用方式，不同于日期选择器

element时间范围选择器使用，区别于日期选择器的用法

背景：

项目需要选择时间段，但是一看element的选择器，文档寥寥数字，就介绍怎么设置参数了，但是至于怎么接收数据，就没有提到了，有点烦，csdn搜，看到好几个，都是神马玩意，copy官网代码下来，毫无价值的博客，也是服了，这种博客写来有什么意义？

效果图：

代码实现：

<el-time-picker
   is-range
   v-model="serviceTime.input.time"
   range-separator="至"
   start-placeholder="开始时间"
   end-placeholder="结束时间"
   placeholder="选择时间范围">
 </el-time-picker>

这样就实现效果了，重在get

//改变时间
serviceTime:{
   input:{
     value:{
       serviceTimeSt:new Date().format('hh:mm:ss'),
       serviceTimeEt:new Date().format('hh:mm:ss'),
     },
     time:{
       get () {
         let time = []
         if (this.parent.value.serviceTimeSt) {
           time.push(new Date(2019, 1, 1, ...this.parent.value.serviceTimeSt.split(':')))
         } else {
           time.push(new Date(2019, 1, 1, 0, 0, 0))
         }
         if (this.parent.value.serviceTimeEt) {
           time.push(new Date(2019, 1, 1, ...this.parent.value.serviceTimeEt.split(':')))
         } else {
           time.push(new Date(2019, 1, 1, 23, 59, 59))
         }
         return time
       },
       set (val) {
         this.parent.value.serviceTimeSt = val[0].format('hh:mm:ss')
         this.parent.value.serviceTimeEt = val[1].format('hh:mm:ss')
       }
     },
     currentData:{}
   },
  
 }