This content originally appeared on CodeSource.io and was authored by Jatin Hemnani
In this article, you will learn about Props in Svelte. Props is short for Properties, and it is used for passing data from one component to another.
How To Pass Data Using Props
In Svelte, it is very easy to pass props compared to React. As you just have to add an export word at the beginning of the variable which you want to pass as props.
User.svelte
<script>
export let name=''
export let age=''
</script>
<h3>
{name}
</h3>
<h4>
{age}
</h4>
And you can use this component with props anywhere, you just have to import it and use it.
App.svelte
<script>
import Card from './User.svelte'
</script>
<User name='Jatin' age=22 />
<User name='John' age=25 />
<User name='Zayn' age=30 />
And this will render the name and age of the user in the DOM.
The post Props In Svelte – code example appeared first on CodeSource.io.
This content originally appeared on CodeSource.io and was authored by Jatin Hemnani
Jatin Hemnani | Sciencx (2021-02-19T14:57:09+00:00) Props In Svelte – code example. Retrieved from https://www.scien.cx/2021/02/19/props-in-svelte-code-example/
Please log in to upload a file.
There are no updates yet.
Click the Upload button above to add an update.