📘 DOC: show how to pass props (#1381)

* show how to pass props

In the current documentation it is only shown how to receive props but not how to pass a component said props.

This adds a bit of code which shows how to pass props to a component.

* Update docs/src/pages/core-concepts/astro-components.md

Co-authored-by: Caleb Jasik <calebjasik@jasik.xyz>

1 files changed, 11 insertions, 0 deletions

diff --git a/docs/src/pages/core-concepts/astro-components.md b/docs/src/pages/core-concepts/astro-components.md
index 1fe96646b..f85e9f138 100644
--- a/docs/src/pages/core-concepts/astro-components.md
+++ b/docs/src/pages/core-concepts/astro-components.md
@@ -184,6 +184,17 @@ const { greeting = 'Hello', name } = Astro.props;
 </div>
 ```
 
+You can then pass the component props like this:
+
+```astro
+---
+// SomeOtherComponent.astro
+import SomeComponent from "./SomeComponent.astro";
+let firstName = "world!";
+---
+<SomeComponent name={firstName}/>
+```
+
 ### Slots
 
 `.astro` files use the [`<slot>`](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/slot) tag to enable component composition. Coming from React or Preact, this is the same concept as `children`. You can think of the `<slot>` element as a placeholder for markup which will be passed in from outside of the component.