Within my code, I am exploring the use of complex prop types in certain instances. Below is an example of what I have in mind:
enum Country {
[...]
}
interface IPerson {
firstname: string;
lastname: string;
}
interface IAddress {
street: string;
houseNo: string;
city: string;
postalCode: string;
country: number;
}
interface ITestComponentProps {
person: IPerson;
addresses: Array<IAddress>;
}
My goal is to utilize this structure in TestComponent.vue like so:
[...]
const props = defineProps<ITestComponentProps>();
[...]
If I were to incorrectly provide the props in a different structure, such as:
[...]
<TestComponent :props="'foo'" />
[...]
The expectation would be to receive some form of error message indicating the incorrect prop structure. However, according to Vue documentation:
Complex types and type imports from external files are not supported at present. There may be plans to introduce support for type imports in the future.
Is anyone aware of a workaround to achieve the desired behavior or when support for complex types will be implemented?