Declaring props with export let in Svelte - Cheat Sheet & Quick Revision

Recall & Review

beginner

What does export let do in a Svelte component?

It declares a property (prop) that the component can receive from its parent. This lets the parent pass data into the child component.

beginner

How do you set a default value for a prop in Svelte?

You assign a value when declaring the prop, like <code>export let name = 'Guest';</code>. If the parent doesn't pass a value, the default is used.

intermediate

Can you change the value of a prop inside a Svelte component after it is set?

Yes, you can reassign the prop inside the component, but it won't affect the parent. Props are one-way: parent to child.

beginner

Why use export let instead of just let in Svelte?

export let makes the variable a prop that the parent can set. Plain let is private to the component and can't receive values from outside.

intermediate

What happens if a parent component does not pass a prop declared with export let and no default is set?

The prop will be undefined inside the child component, which might cause errors if not handled.

In Svelte, how do you declare a prop named title?

A export let title;

B let export title;

C prop title;

D export prop title;

The correct syntax to declare a prop is export let title;.

What is the default value of a prop if you write export let count = 10; and the parent does not pass count?

A 0

B null

C undefined

D 10

The default value 10 is used if the parent does not provide a value.

If a parent passes a prop to a child component, can the child update the parent's value directly?

A No, props are one-way from parent to child

B Only if you use a store

C Only if you use <code>export let</code>

D Yes, props are two-way bound by default

Props flow one-way from parent to child. The child cannot directly change the parent's value.

What happens if you declare let name; without export in a Svelte component?

A It becomes a prop

B It is private to the component and cannot receive values from outside

C It causes an error

D It is automatically exported

Without export, the variable is private and cannot receive values from the parent.

How can you provide a fallback value for a prop in Svelte?

A Use <code>prop: defaultValue;</code>

B Use <code>let prop = defaultValue;</code>

C Use <code>export let prop = defaultValue;</code>

D Use <code>default prop = defaultValue;</code>

Assigning a value during declaration with export let sets a default fallback.

Explain how to declare and use props in a Svelte component using export let.

Think about how a parent sends data to a child component.

Describe what happens if a prop declared with export let is not passed by the parent and no default value is set.

Consider what the child component sees when no value is given.