使用 Javascript 为日期选择器获取从今天开始的日期数组

Question

我正在尝试编写一个函数，该函数 returns 从今天到最大日期的日期数组，以便我可以限制日期选择器的选择。目前我有以下内容：-

   datesAfterToday: function (date) {
    var dates = []
    var currentDate = new Date()
    var endDate = new Date(8640000000000000).getFullYear()
    var addDays = function (days) {
      var date = new Date(this.valueOf())
      date.setDate(date.getDate() + days)
      return date
    }
    while (currentDate <= endDate) {
      dates.push(currentDate)
      currentDate = addDays.call(currentDate, 1)
    }
    return dates
  }

然后我使用 Vue.js 按如下方式安装它：-

 mounted () {
   this.allowedDates = this.datesAfterToday
 },

但是我只得到一个对象数组而不是正确的数组。

如何获得正确的日期数组，以便将其绑定到允许的日期属性。

感谢您的帮助和时间！

Answer 1

另一种选择是使用 vuejs-datepicker 例如：

<script>
var state = {
    disabled: {
        to: new Date(), // Disable all dates up to specific date
        from: new Date(8640000000000000) // Disable all dates after specific date        
    }
}
</script>

<datepicker :disabled="state.disabled"></datepicker>

请参阅文档中的 Disabled Dates。

Answer 2

对于初学者 new Date(8640000000000000).getFullYear() 会将 endDate 设置为该日期的年份，即 275760。 currentDate 将是今天的日期（以毫秒为单位），在我撰写本文时为 1511272934156。如您所见，currentDate 始终大于 endDate，因此您的 while 循环永远不会进入其中的语句。

另一个问题是您选择的日期非常遥远，而且您每次都在填充一个数组。您的循环很可能会使页面冻结或完全崩溃。尝试选择一个更易于管理的日期。

例如，在下面的代码片段中，我通过首先将其初始化为今天，然后将年份设置为从现在起整整一年来设置 endDate。这给了我一个大约有 365 个值的数组。

你可以想象如果我使用未来273,748年的年份，这个数组会有多大。

var dates = []
var currentDate = new Date()
var endDate = new Date()

endDate.setFullYear(endDate.getFullYear()+1)

var addDays = function (days) {
  var date = new Date(this.valueOf())
  date.setDate(date.getDate() + days)
  return date
}

while (currentDate <= endDate) {
  dates.push(currentDate)
  currentDate = addDays.call(currentDate, 1)
}
    
console.log(dates)

综上所述，看起来您实际上可以传递指定最小值和最大值的对象而不是数组。

https://vuetifyjs.com/components/pickers#example-6

let d = new Date()                  // today
let d2 = new Date()    
d2.setFullYear(date.getFullYear()+1) // Next year

this.allowedDays = {
    min : d.toISOString().substr(0, 10), // e.g. 2017-11-21
    max : d2.toISOString().substr(0, 10)
}

使用 Javascript 为日期选择器获取从今天开始的日期数组

get an array of dates from today for datepicker with Javascript

javascript

vue.js

vuetify.js