Vue смотрите ошибку TypeScript TS2769: этому вызову не соответствует ни одна перегрузка - PullRequest
Новая
       124

Vue смотрите ошибку TypeScript TS2769: этому вызову не соответствует ни одна перегрузка

0 голосов
/ 07 мая 2020

Рассмотрим следующий код: 

export default defineComponent({
  setup() {
    const miniState = ref(true)

    const setMiniState = (state: boolean, screenWidth: number) => {
      if (screenWidth > 1023) {
        miniState.value = false
      } else if (state !== void 0) {
        miniState.value = state === true
      }
      else {
        miniState.value = true
      }
    }

    watch('$q.screen.width', (width) => setMiniState(true, width))

    return { miniState, setMiniState }
  }
})

TypeScript выдает эту ошибку:

TS2769: этому вызову не соответствует ни одна перегрузка.
Перегрузка 1 из 3, '(источник : SimpleEffect, options ?: Pick, "deep" | "flu sh"> | undefined): StopHandle ', выдает следующую ошибку. Аргумент типа «$ q.screen.width» не может быть назначен параметру типа SimpleEffect.

Перегрузка 2 из 3, '(источник: WatcherSource, cb: WatcherCallBack, options? Partial | undefined ): StopHandle ', выдал следующую ошибку. Аргумент типа «$ q.screen.width» не может быть назначен параметру типа WatcherSource.

Перегрузка 3 из 3, '(источники: WatcherSource [], cb: (newValues: unknown [], oldValues: unknown [], onCleanup: CleanupRegistrator) => any, options ?: Partial | undefined): StopHandle ', выдал следующую ошибку. Аргумент типа «$ q.screen.width» не может быть назначен параметру типа «WatcherSource []».

Это для следующей строки кода: 

watch('$q.screen.width', (width) => setMiniState(true, width))

В его нынешнем виде я передаю string функции watch вместо WatcherSource<any>. Я пробовал следующее, но все они терпят неудачу: 

watch('$q.screen.width' as WatcherSource, (width) => setMiniState(true, width)) // fails

watch(('$q.screen.width' as WatcherSource ), (width) => setMiniState(true, width)) // fails

Как правильно решить эту проблему?

1 Ответ

1 голос
/ 07 мая 2020

Вот определение watch и WatcherSource

function watch<T>(
  source: WatcherSource<T>,
  callback: (
    value: T,
    oldValue: T,
    onInvalidate: InvalidateCbRegistrator
  ) => void,
  options?: WatchOptions
): StopHandle

type WatcherSource<T> = Ref<T> | (() => T)

В соответствии с этим вы должны либо передать ref, либо callback. 

watch(() => $q.screen.width, (width) => setMiniState(true, width))
...