element-plus时间⽇期选择器el-date-pickervalue-format⽆效等vue3.0 配合  element-plus  在使⽤时间⽇期选择时, value-format ⽆法设置选中值的解决办法,以及⼀些零零散散的坑
完整代码:
<!-- HTML部分 -->
<el-date-picker
v-model="ruleForm.f_xdsj_time"
type="datetimerange"
range-separator="⾄"
start-placeholder="开始⽇期"
end-placeholder="结束⽇期"
@change="timeFn1"
:default-time="defaultTime"
format="YYYY-MM-DD"
class="elDatePicker"
:clearable="false"
>
</el-date-picker>
/*-- js逻辑部分 --*/
//格式化--时间
function timeStr(dataStr){
var date = new Date(dataStr);
var y = FullYear();
var m = Month() + 1;html特效代码时间日期
m = m < 10 ? ('0' + m) : m;
var d = Date();
d = d < 10 ? ('0' + d) : d;
var h = Hours();
h = h < 10 ? ('0' + h) : h;
//获得分
var mm = Minutes()
mm = mm < 10 ? ('0' + mm) : mm;
//获得秒
var ss = Seconds()
ss = ss < 10 ? ('0' + ss) : ss;
/
/ console.log(y+'-'+m+'-'+d+' '+h+':'+mm+':'+ss)
return y+'-'+m+'-'+d+' '+h+':'+mm+':'+ss
}
//⽤户选定值以后触发
const timeFn1 = (data)=>{
console.log(data)
if(data == null){
//如果data等于null 则表⽰⽤户点击了时间选择器的清空按钮,因为清空按钮没有回调函数说以⽤这个⽅法来解决
}else{
//如果data不等于null 就可以把data的值复给想要的变量
ruleForm.XX_begin = timeStr(ruleForm.f_xdsj_time[0])
ruleForm.XX_end = timeStr(ruleForm.f_xdsj_time[1])
}
}
//给出默认值--如果需要设置默认的时分秒可以⽤这个⽅法,修改后⾯3位就⾏,这种写法不是⽤来添加默认值的。
const defaultTime = [
new Date(2000, 1, 1, 0, 0, 0),
new Date(2000, 2, 1, 23, 59, 59)
]

版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。