Extracting Vue component props as a type

Question

I have a few Vue components and I wish to extract the props from such component and use them as a type instead of a value. I have another component whereas I would like to take in a prop which is an array of another component's props like such.

props: {
    links: Array<CardLink>
}

I have tried forgoing having individual props and creating a custom class outlining the values I want inside my component (This being in reference to the CardLink component) and then taking in the values in a class instance bound to a prop name as such.

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}
    }
}

How can I bring content to the top of my scope so I won't have to type content each time I wish to access a attribute?

Any advice would be appreciated. Thanks!

Answer 1

Apologies, I ended up finding the solution to be as simple as deconstructing content inside my data() function like so.

data() {
    return {
        ...this.content,
    }
}

which will allow you to access the attributes. Thanks!