DateTimePicker 日期时间选择器设置默认时间

default-value属性接受一个数组,第一项为开始时间,第二项为结束时间,时间格式为:“YY-mm-dd HH:mm:ss”。例如:
:default-value = [‘2021-05-06 00:00:00’ , ‘2021-05-07 00:00:00’]

            <el-form-item
                prop="examStartEndTime"
                label="请选择考试时间:"
                label-width="140px"
                required
            >
                <el-date-picker
                    v-model="addBatchData.examStartEndTime"
                    type="datetimerange"
                    range-separator="至"
                    start-placeholder="开始日期"
                    end-placeholder="结束日期"
                    value-format="yyyy/MM/dd HH:mm:ss"
                    :default-value = ['2021-05-06 00:00:00' , '2021-05-07 00:00:00']
                    size="large"
                />
            </el-form-item>

如果要动态改变默认时间的值,请直接往绑定的数组push时间,不能直接赋值,例如

        <el-form-item
            prop="examStartEndTime"
            label="请选择考试时间:"
            label-width="140px"
            required
        >
            <el-date-picker
                v-model="addBatchData.examStartEndTime"
                type="datetimerange"
                range-separator="至"
                start-placeholder="开始日期"
                end-placeholder="结束日期"
                value-format="yyyy/MM/dd HH:mm:ss"
                :default-value = 'defaultTime'
                size="large"
            />
        </el-form-item>
        data(){
			return {
				defaultTime:[],
		    }
	    },
	    created(){
	         //这种写法组件中不会显示默认时间
	       // this.defaultTime[0] = '2021-05-06 00:00:00'  
	       // this.defaultTime[1] = '2021-05-07 00:00:00' 
			//采用push的形式更改数组的值,组件中会显示默认时间
	        this.defaultTime.push( '2021-05-06 00:00:00')  
	        this.defaultTime.push( '2021-05-07 00:00:00') 
	    }
Logo

为开发者提供学习成长、分享交流、生态实践、资源工具等服务,帮助开发者快速成长。

更多推荐