vue数组传值,大伙看看哪里有问题?

关键代码:

<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传入的必须是数组,但是我这样做了之后发现并不能正常显示,请问大家是什么问题?

img

赋值需要是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());

按你的代码我这边是报错的(见图),不知道是不是咱俩用的版本不一样的问题。

img

你最后要的页面效果是什么样的?我这边用我说的方式能看到的是下面的这样子。不知道是不是你要的效果。

img

看文档注意————————"开始时间必须是周一,结束时间必须是周日"