很多公司都有一套自己的公司前端框架,自己现在是在恒生电子的公司做着实习,用着公司提供的前端框架,具体是怎么样的我就不说了,用的是vue.js的框架,鉴于我本身是个vue的初学者,还是个小白,所以我学的可能比较蠢,遇到的问题也比较蠢,以至于,在前阵子的时候就遇到了问题,是关于这个时间选择器的日期限定,查阅了公司自己给出的官方文档,上面和ElementUI的时间选择器文档是一样的。
对于时间选择器的日期限定呢,就是放了一个options,然后,在对应的option里面,把限定写上去。例如
data():{
return{
option:{
disabledDate(date){
return date.valueOf() < Date.now() - 86400000
}
}
}
}
这个是选择今天,及今天之后的,顺带一提这个86400000就是一天的毫秒,valueof具体是代表什么,百度一下你就知道,我就不说了,
然后关于限定时间范围的话,我们可以用||来解决
data():{
return{
option:{
disabledDate(date){
return date.valueOf() < Date.now() - 86400000 || date.valueOf()>Date.now()+86400000*30
}
}
}
}
那么问题来了,根据现在的需求,我们需要动态更改的时间,并不是今天,而是从后台传上来的时间,那么这个Data.now()根本就没什么用,但是吧,很多更我一样的人,应该都尝试过,从父组件里调值,在option里输入,然后失败了。
我曾经也怀疑过是时间周期的问题,特意在beforecreate()的方法里,建立了变量,从this.$options 里去调值来输入,无一例外全部爆炸。
当然可能是我没有vue基础的可能的原因,或者说是前端框架自身设计上出的一点问题,我发现在options里写接受变量和创建变量都是直接爆炸的。
那该怎么办?是不是我也直接爆炸?
很显然是不可能的,我在尝试了许多可能性的情况下,找到了这么一种办法就是在created里面,创建了一个方法,并且把他赋值到了时间选择器的option里面去,根据vue的特性,他自己刷新了option的内容,并且成功的把这个限定写了上去。
data():{
return{
option:{
disabledDate(date){
}
}
}
},
props:{
daylimt:{
type:Number,
default:31,
},
timedata:'',
},
created(){
let time1 = this.timedata
let count = this.daylimit
if(count == '')count = 31
let limt = funtion(date){
let timenow = new Date()
timenow.setFullYear(time1) //根据自己后台传输来的time记录方式进行创建timenow
return date.valueOf()<timenow.valueOf()-86400000||date.valueOf()>timenow.valueOf()+86400000*count;
}
this.options.disabledDate = limit
}
然后知道了,外部可以更改这个属性,这限制还不是我想怎么写就怎么写,我想上天都可以,哈哈哈哈或或或或或或或或或或或或或或或