Subscribe on changes!

(types) cannot cast nullable function type with PropType

avatar
Aug 15th 2021

Version

3.2.2

Reproduction link

https://codesandbox.io/s/flamboyant-pasteur-bc3fu?file=/src/index.ts

Steps to reproduce

import { defineComponent, PropType } from 'vue'

export interface Config {
  onSubmit: (values: Record<string, any>) => void;
  validate?(): string | undefined,
}

export default defineComponent({
  props: {
    onSubmit: Function as PropType<Config['onSubmit']>,
    validate: Function as PropType<Config['validate']>, // error line
  },
  setup(props) {
    const err = props.validate?.()
  }
})

What is expected?

No TS error

What is actually happening?

I am getting the following error:

Conversion of type 'FunctionConstructor' to type 'PropType<(() => string | undefined) | undefined>' may be a mistake because neither type sufficiently overlaps with the other. If this was intentional, convert the expression to 'unknown' first.
  Type 'FunctionConstructor' is not comparable to type '() => (() => string | undefined) | undefined'.

As you can see this only happens when i try to cast type which is potentially undefined because onSubmit works fine. I know there are two ways to work around this error:

validate: Function as PropType<Exclude<Config['validate']>, undefined>
validate: Function as unkknown as PropType<Config['validate']>

but I wonder if this is a bug or if I should use the above examples. thanks for your guidance and help. ✌