Props & TypeScript in Astro
From the Astro cheat sheet · Components & Syntax · verified Jul 2026
Props & TypeScript
astro
---
interface Props {
title: string;
count?: number;
items: string[];
}
const { title, count = 0, items } = Astro.props;
---
<div>
<h2>{title}</h2>
<p>Count: {count}</p>
<ul>
{items.map(item => <li>{item}</li>)}
</ul>
</div>✅ Access props via Astro.props object
💡 Use interface Props for TypeScript type checking
🔍 Destructure with default values for optional props
⚡ Functions cannot be passed to hydrated framework components
propstypescripttypes
Continue with Astro
Save the full cheat sheet or work through every related task.