I created a small Vue functional component that receives a prop from its parent:
export default defineComponent({
name: 'ExpandedMovieInformation',
props: {
movie: {
type: Object as PropType<Movie>,
},
},
setup(props, { emit }) {
const { movie } = props;
},
});
</script>
<template>
<div>
<div class='overlay'>
<h1>{{ movie.title }}</h1>
<span class='release-date'>{{ movie.release_date }}</span>
<p>{{ movie.overview }}</p>
</div>
</div>
</template>
https://i.sstatic.net/CQxHn.png
Starting the component in the parent:
<ExpandedMovieInformation
:movie="currentMovie" />
The code compiles without errors, but warnings appear in the template:
https://i.sstatic.net/LN6up.png
How can I correctly assign a type to a prop to ensure it is not potentially undefined?