关键代码:
<el-calendar :range="monAndSun"></el-calendar>
js部分:
data () {
return {
monAndSun: ['', '']
}
},
mounted () {
// 获取本周的周一和周日
var now = new Date()
const nowTime = now.getTime()
const day = now.getDay()
const oneDay = 24 * 60 * 60 * 1000
const monTime = nowTime - (day - 1) * oneDay
const sunTime = nowTime + (7 - day) * oneDay
const mon = new Date(monTime)
const sun = new Date(sunTime)
this.monAndSun[0] = mon.getFullYear() + '-' + (mon.getMonth() + 1) + '-' + mon.getDate()
this.monAndSun[1] = sun.getFullYear() + '-' + (sun.getMonth() + 1) + '-' + sun.getDate()
}
因为element-ui官方文档要求range传入的必须是数组,但是我这样做了之后发现并不能正常显示,请问大家是什么问题?
赋值需要是date类型的数据,你给的是string。
this.monAndSun[0] = new Date(mon.getFullYear() + '-' + (mon.getMonth() + 1) + '-' + mon.getDate());
this.monAndSun[1] = new Date( sun.getFullYear() + '-' + (sun.getMonth() + 1) + '-' + sun.getDate());
按你的代码我这边是报错的(见图),不知道是不是咱俩用的版本不一样的问题。
你最后要的页面效果是什么样的?我这边用我说的方式能看到的是下面的这样子。不知道是不是你要的效果。
看文档注意————————"开始时间必须是周一,结束时间必须是周日"