I'm facing a dilemma with my Vue components. I want to extract the props from one component and use them as a type instead of a value in another component. Specifically, I have a component where I need to take in an array of props from a different component.
props: {
links: Array<CardLink>
}
After experimenting, I tried creating a custom class that defines the values I need within my component (referencing the CardLink component). Then, I attempted to bind these values to a prop name using a class instance.
export class CardLink {
text: string;
url: string;
constructor(text: string, url: string) {
this.text = text;
this.url = url;
}
}
export default {
props: {
content: {type: CardLink, required: true}
}
}
My main question is how can I elevate the content prop to the top of my scope so that I don't have to repeatedly type it every time I access one of its attributes?
If anyone has any advice on this matter, I would greatly appreciate it. Thank you!