尝试从选择器选项访问日期数组时为空

Question

我有一个从服务器填充的日期数组，它定义了要在日期选择器上禁用的日期

 getStaffAvailability(){
            let x = this;
            this.$http.get(this.weeklyAvailabilityUrl + "GetAvailableDaysForStaff/" + this.entity.staffId)
                .then(function (event: any) {
                    x.staffAvailableDays = event.body;
                });
        }

在此方法运行后，我可以在 vue 开发工具上清楚地看到该数组按预期填充了值... https://i.stack.imgur.com/9cUpx.png

但是，当我尝试访问数组时，在 datepicker 选项的 disableddates 方法中，它是空的并且其中没有值。我不明白这是为什么。

 export default class StaffAllocation extends Mixins<BaseCrudMixin>(BaseCrudMixin) {
        staffAvailableDays: Date[];
        datePickerOptions: any;

        @Prop(Number) eventId!: number;

        constructor() {
            this.staffAvailableDays = [];
            this.datePickerOptions = {
                disabledDate: (currentDate: Date) => {
                    return (this.staffAvailableDays.findIndex(item => { return item.getTime() == currentDate.getTime() })) == -1;
                }
            };
}

Answer 1

根据您的屏幕截图，this.staffAvailableDays 是 string 的数组，而不是 Date 的数组。这意味着item.getTime() 会抛出异常。

您可以尝试在分配日期之前解析日期：

getStaffAvailability(){
  let x = this;
  this.$http.get(this.weeklyAvailabilityUrl + "GetAvailableDaysForStaff/" + this.entity.staffId)
  .then(function (event: any) {
    x.staffAvailableDays = event.body.map(function (d) {
      return new Date(Date.parse(d));
    });
  });
}