iview/test/routers/date.vue

<template>
    <div style="margin: 50px">
        <br>
        <row>
            <i-col span="4">
                <date-picker
                        style="width:200px"
                        placeholder="请选择日期"
                        :value.sync="value"
                        :options="options"
                        @on-change="change"
                        :format="format"
                        @on-open-change="change2"></date-picker>
            </i-col>
            <i-col span="4">
                <date-picker type="year" style="width:200px" placeholder="请选择日期" :value.sync="value" :options="options"></date-picker>
            </i-col>
            <i-col span="4">
                <date-picker type="month" style="width:200px" placeholder="请选择日期" :value.sync="value" :options="options"></date-picker>
            </i-col>
        </row>
    </div>
</template>
<script>
    export default {
        data () {
            return {
                value: new Date(),
//                value: '',
                options: {
                    disabledDate(time) {
//                        console.log(time)
//                        return time.getFullYear() < 2016;
                        return time.getTime() < Date.now() - 8.64e7;
//                        return time && time.valueOf() < Date.now();
                    }
                },
                format: 'yyyy年MM月dd日'
            }
        },
        computed: {},
        methods: {
            change (date) {
                console.log(date)
            },
            change2 (s) {
//                console.log(s)
            }
        }
    }
</script>