How to set the default value of vue-mobile-calendar?

The date selection component is referenced in the

vue component, in which the parameter defaultDate, which is configured to select the current date by default, displays the current date by default. Now I want to implement any date brought from the parent component and change the current default selected date to the date brought by the parent component. Now the date has passed, and there is no problem with format conversion, that is, the current default selected date can not be changed all the time. Ask for advice
html as follows
< calendar

.
:defaultDate="defaultDate"
@change="handelChange">

< / calendar >

js is as follows
export default {

    name: "Afterpat",
    data () {
        return {
            defaultDate:new Date(),
            calendarShow: true,
            minDate: new Date("2010/1/1"),
            maxDate: new Date("2040/1/1"),
            month:    ["", "", "", "", "", "", "", "", "", "", "", ""],
            week:["", "", "", "", "", "", ""],
            closeByClickmask: false,
            rangeHours: 0,
            rangeMinutes: 0,
            value:0,
            timeHour:"",
            timeMinutes: "",
            dateValue: "",
            // curDate: this.dateSelect
        }
    },
    watch:{
        rangeHours(val) {
            if(parseInt(val/(100/24))<10) {
                // this.rangeHours = parseInt("0") +  parseInt(val/(100/24))
                console.log(this.rangeHours)
            }
        },
        rangeMinutes(val) {
            if(parseInt(val/(100/60))<10) {
                // this.rangeMinutes = "0" +parseInt(val/(100/60) ).toString()
            }
        },
        // dateSelect(val){
        //     // alert(val)
        //     this.defaultDate = val
        //     console.log(this.defaultDate)
        // }
    },
    mounted(){
    },
    methods: {
        onChange(value) {
            // console.log(value)
        },
        onChangeTwo(value) {
            // console.log(value)
        },
        formatDate(date) {
            const y = date.getFullYear()
            let m = date.getMonth() + 1
            m = m < 10 ? "0" + m : m
            let d = date.getDate()
            d = d < 10 ? ("0" + d) : d
            let h = date.getHours()
            h = h <10 ? ("0"+h):h
            let min = date.getMinutes()
            min = min < 10?("0" + min):min
            let s = date.getSeconds()
            s = s<10?("0"+s):s
            return y + "-" + m + "-" + d + " "
        },
        handelChange(date){
            // this.calendarShow = true
            this.dateValue = this.formatDate(date)
            // var date = this.formatDate(date)
            // this.$emit("timeSelect", data)
            this.closeByClickmask = false
        },
        confirm(){
            // this.calendarShow = true
            var date = ""
            var isStop = false
            var defaultDate = this.formatDate(new Date())
            if(this.dateValue && defaultDate) {
                date = this.dateValue
                
            } else {
                date = defaultDate
            }
            if(parseInt(this.rangeHours/(100/24) )<10) {
                this.timeHour = "0" + parseInt(this.rangeHours/(100/24) ).toString()
            } else {
                this.timeHour = parseInt(this.rangeHours/(100/24) ).toString()
            }
            if(parseInt(this.rangeMinutes/(100/60))<10) {
                this.timeMinutes = "0" + parseInt(this.rangeMinutes/(100/60)).toString()
            } else if(parseInt(this.rangeMinutes/(100/60)) == 60) {
                this.timeMinutes = "00"
            } else {
                this.timeMinutes = parseInt(this.rangeMinutes/(100/60)).toString()
            }
            let data = {}
            if(this.hasDate == "none") {
                data = {
                    isShow: false,
                    time:date
                }
            } else {
                data = {
                    isShow: false,
                    time:date + "" + this.timeHour + ":" + this.timeMinutes
                }
            }
            this.$emit("timeSelect", data)
        }
    },
    computed: {
    },
    components:{
        Range
    },
    created(){
        // if(this.dateSelect) {
        //     this.defaultDate = this.dateSelect
        // } else {
        //     this.defaultDate = new Date()
        // }
        if(!sessionStorage.getItem("openId")) {//androidsessionopenid
            var href=window.location.href
            this.base.wxinit(href)
        }
        this.base.getWxOpenid()
    },
    props: {
        hasDate: {
            type: String,
            default () {
                return ""
            }
        },
        type: {
            type: String,
            default () {
                return ""
            }
        },
        // dateSelect: {
        //     type: Date,
        //     default () {
        //         return new Date()
        //     }
        // }
    }

}
Apr.05,2021

excuse me, I have a problem, that is, how can I modify this when the default style of calendar is display: none?

Menu