Subscribe on changes!

setup types Date prop as string

avatar
Feb 4th 2021

Version

3.0.5

Reproduction link

https://codesandbox.io/s/setup-props-date-3jkl9?file=/src/main.ts

Steps to reproduce

Create a component using the composition API that has a prop with the Date type.

import { computed, defineComponent, toRefs } from "vue";

defineComponent({
  props: {
    date: {
      type: Date,
      required: true
    }
  },

  // The error is here: Vue thinks the type of props should be { date: string }
  setup(props: { date: Date }) {
    const { date } = toRefs(props);
    const formattedDate = computed((): string => date.value.toISOString());

    return {
      formattedDate
    };
  }
});

What is expected?

The property in the props dictionary that is an argument to the setup function has the type string.

What is actually happening?

The property in the props dictionary that is an argument to the setup function should have the type Date.

avatar
Feb 4th 2021

I discovered that defining setting the date type to Date as PropType<Date> and removing the type annotation from setup works, as suggested in #1494. That gets my code working again, but it seems a little hacky, and it would be nice if Vue could correctly infer prop types for dates like it can for numbers and strings.