Доступ к переменной данных в функции другой переменной - не определено - PullRequest
Новая
       4

Доступ к переменной данных в функции другой переменной - не определено

0 голосов
/ 17 января 2020

Мне нужно сделать проверку даты в Vue в зависимости от Vue моделей.

Проблема в том, как работает эта проверка даты. Мне нужно определить переменную в data сегменте, который содержит disabledDate функцию. Итак, вот упрощенный код:

Шаблон: 

<el-date-picker type="date"
  v-model="date1"
  :picker-options="datePickerOptions1">
</el-date-picker>

JS: 

data() {
  return {
    date: null,
    rev: {
      validDate: null
    },
    datePickerOptions1: {
      disabledDate(date) {
        return date < this.rev.validDate;
      }
    }
  }
},
mounted: function() {
  var today = new Date();
  this.rev.validDate = today.getDate();
}

Консоль говорит: this.rev.validDate это undefined.

В моем случае this.rev.validDate извлекается из базы данных, пока компонент монтируется, и в зависимости от этого el-date-picker должен работать.

Я бы попросил любые предложения:)

1 Ответ

2 голосов
/ 17 января 2020

Метод disabledDate глубоко вложен туда, где он теряет текущий экземпляр Vue (в противном случае доступен через контекст this). Чтобы обойти это, вы можете назначить экземпляр переменной, например: 

data() {
  const vm = this;

  return {
    date: null,
    rev: {
      validDate: null
    },
    datePickerOptions1: {
      disabledDate(date) {
        return date < vm.rev.validDate;
      }
    }
  }
}

или с помощью функции стрелки: 

data: vm => ({
  date: null,
  rev: {
    validDate: null
  },
  datePickerOptions1: {
    disabledDate(date) {
      return date < vm.rev.validDate;
    }
  }
})
...