【iView】日期组件 DatePicker

年月  2019/06

<Form ref="mydate" :model="currentDate" :rules="rules">
    <FormItem label="期间" prop="date">
        <DatePicker v-model="currentDate.date" 
            type="month" 　　　　　　　
            format="yyyy/MM" 
            placeholder="请输入日期" 
            @on-change="dateChange"
            clearable 
         ></DatePicker>
    </FormItem>
</Form>

data:{
    currentDate: { // 组件的日期数据
        date: ''
    },
    rules: {
        date: [
            { required: true, type: 'date', message: '日期不能为空', trigger: 'change' } 
        ]
    }
}

添加时type = 'date'，日期组件只能识别标准时间（例如：Sat Jun 01 2019 00:00:00 GMT+0800 (中国标准时间)）

编辑时type = 'string'，所以拿取的默认值（例如：2019/06）,需要做转化以后iview日期组件才能识别

methods: {
    edit(){        
        this.currentDate.date= new Date(this.currentDate.date.replace(/(\d{4})(\d{2})(\d{2})/g, '$1-$2-$3')) 
    },
    dateChange (date) { // 检测日期组件的改变，重新给 currentDate.date 赋值
        this.currentDate.date = date
    }
}

时间段 ['2012-09-10','2012-10-10']

<Form ref="mydate" :model="currentDate" :rules="rules">
    <FormItem label="期间" prop="date">
         <DatePicker type="datetimerange" 
            placeholder="请选择时间段" 
            v-model="currentDate.date"
            @on-change="changeTime"></DatePicker>
    </FormItem>
</Form>

date: [
    {
        required: true,
        type: 'array',
        message: "请输入时间",
        trigger: 'blur',
        fields: {
            0: {type: "date", required: true, message: "请选择开始时间"},
            1: {type: "date", required: true, message: "请选择结束时间"}
        }
    }
]