Как избавиться от ошибки в v-on обработчике: «Ошибка типа: _vm.myFcn не является функцией»? - PullRequest
Новая
       82

Как избавиться от ошибки в v-on обработчике: «Ошибка типа: _vm.myFcn не является функцией»?

1 голос
/ 28 апреля 2020

Следуя документации , я написал Vue компонент, содержащий следующие логики c: 

import debounce from 'lodash/debounce'

export default {
  [...]
  created () {
    this.debouncedOnSubmit = debounce(this.doSubmit, 1000)
  },
  [...]

Идея заключается в том, что моя форма вызывает debouncedOnSubmit метод при отправке формы: 

        <button
          name="order-basket"
          type="submit"
          @click.prevent="debouncedOnSubmit"
        >
          Click me!
        </button>

Теперь этот код отлично работает как в моем приложении, так и в моих шутливых тестах. Например, с помощью тестовых утилит vue я могу вызвать событие click для этой кнопки, и соответствующие действия, которые должны произойти после нажатия этой кнопки, могут быть успешно проверены.

Однако я получаю следующее досадное предупреждение: 

[Vue warn]: Error in v-on handler: "TypeError: _vm.debouncedOnSubmit is not a function"

Я частично понимаю, почему я получаю это предупреждение. Действительно, я определяю this.debouncedOnSubmit в created() hook. Вполне вероятно, что Jest не понимает значения этой переменной, даже если метод debounce возвращает функцию.

Как заставить jest понять, что debouncedOnSubmit - это функция? Что мне нужно настроить?

Я не хочу отключать предупреждения, как объяснено здесь , потому что я хочу оставить отзыв о своих действиях в моих тестах. В большинстве случаев предупреждения действительно полезны, и мне не нравится идея их отключать. Как я могу написать свой код, чтобы это предупреждение было исправлено?

РЕДАКТИРОВАТЬ

  • изменяя 
@click.prevent="debouncedOnSubmit"

на 

@click.prevent="debouncedOnSubmit()"

ничего не меняет в проблеме

  • перемещение debouncedOnSubmit с крюка created() на computed такие вещи 
debouncedOnSubmit: debounce(this.doSubmit, 1000)

бросает ошибка 

TypeError: Cannot read property 'doSubmit' of undefined
  • изменение 
@click.prevent="debouncedOnSubmit"

на 

@click.prevent="debouncedOnSubmit()"

и перемещение debouncedOnSubmit из created() привязка к computed подобным вещам 

debouncedOnSubmit () {
      const submit = this.doSubmit
      return debounce(submit, 1000)
    }

все еще заставляет мое приложение и тесты работать, но я все равно получаю то же предупреждение в моих шутливых тестах: 

[Vue warn]: Error in v-on handler: "TypeError: _vm.debouncedOnSubmit is not a function"
...