:::demo 示例

```html
<template>
  <div>

      <h4>年模式</h4>
      <v-m-date-picker :mode="mode1" v-model="value1" :item-height="itemHeight" :show-count="showCount" :size="size" ></v-m-date-picker>

      <h4>年-月模式</h4>
      <v-m-date-picker :mode="mode2" v-model="value2" :item-height="itemHeight" :show-count="showCount" :size="size" ></v-m-date-picker>

      <h4>年-月-日模式</h4>
      <v-m-date-picker :mode="mode3" v-model="value3" :item-height="itemHeight" :show-count="showCount" :size="size" ></v-m-date-picker>

      <h4>年-月-日 时模式</h4>
      <v-m-date-picker :mode="mode4" v-model="value4" :item-height="itemHeight" :show-count="showCount" :size="size" ></v-m-date-picker>

      <h4>年-月-日 时:分模式</h4>
      <v-m-date-picker :mode="mode5" v-model="value5" :item-height="itemHeight" :show-count="showCount" :size="size" ></v-m-date-picker>

      <h4>年-月-日 时:分:秒模式</h4>
      <v-m-date-picker :mode="mode6" v-model="value6" :item-height="itemHeight" :show-count="showCount" :size="size" ></v-m-date-picker>

      <h4>时模式</h4>
      <v-m-date-picker :mode="mode7" v-model="value7" :item-height="itemHeight" :show-count="showCount" :size="size" ></v-m-date-picker>

      <h4>时:分模式</h4>
      <v-m-date-picker :mode="mode8" v-model="value8" :item-height="itemHeight" :show-count="showCount" :size="size" ></v-m-date-picker>

      <h4>时:分:秒模式</h4>
      <v-m-date-picker :mode="mode9" v-model="value9" :item-height="itemHeight" :show-count="showCount" :size="size" ></v-m-date-picker>

  </div>
</template>

<script>
export default {
  name:"basic",
  data(){
    return {
       mode1:0,
       mode2:1,
       mode3:2,
       mode4:3,
       mode5:4,
       mode6:5,
       mode7:6,
       mode8:7,
       mode9:8,
       value1:'',
       value2:'',
       value3:'',
       value4:'',
       value5:'',
       value6:'',
       value7:'',
       value8:'',
       value9:'',
       size:'small',
       itemHeight:45,
       showCount:9
    }
  },
  created(){

      let currentDate=new Date();
      let year=currentDate.getFullYear();
      let month= this.dateFormat(currentDate.getMonth()+1);
      let day=this.dateFormat(currentDate.getDate());
      let hour=this.dateFormat(currentDate.getHours());
      let minute=this.dateFormat(currentDate.getMinutes());
      let second=this.dateFormat(currentDate.getSeconds());
      this.value1=`${year}`;
      this.value2=`${year}-${month}`;
      this.value3=`${year}-${month}-${day}`;
      this.value4=`${year}-${month}-${day} ${hour}`;
      this.value5=`${year}-${month}-${day} ${hour}:${minute}`;
      this.value6=`${year}-${month}-${day} ${hour}:${minute}:${second}`;
      this.value7=`${hour}`;
      this.value8=`${hour}:${minute}`;
      this.value9=`${hour}:${minute}:${second}`;

  },
  methods:{
      dateFormat(value){

          if(value<10){

              return `0${value}`;

          }

          return value;

      }
  }
}
</script>
```
:::

