在符文模式下，使用[组件属性](basic-markup#Component-props)通过[`$props`]($props)符文进行声明，允许父组件传递数据。

在传统模式下，props 使用 `export` 关键字标记，并可以具有默认值：

```svelte
<script>
	export let foo;
	export let bar = 'default value';

	// Values that are passed in as props
	// are immediately available
	console.log({ foo });
</script>
```

默认值将在组件创建时，如果否则会是 `undefined` 时使用。

> \[!注意\] 与 runes 模式不同，如果父组件将 prop 从定义的值更改为 `undefined`，它不会恢复到初始值。

属性值未指定的属性被视为*必需的*，Svelte 在开发期间如果没有提供值将打印警告，您可以通过指定`undefined`作为默认值来抑制此警告：

```js
export let foo +++= undefined;+++
```

## 
组件导出

导出 `const`、`class` 或 `function` 声明不被视为属性 — 相反，它成为组件 API 的一部分：*不* 被考虑

```svelte
<!--- file: Greeter.svelte--->
<script>
	export function greet(name) {
		alert(`hello ${name}!`);
	}
</script>
```

```svelte
<!--- file: App.svelte --->
<script>
	import Greeter from './Greeter.svelte';

	let greeter;
</script>

<Greeter bind:this={greeter} />

<button on:click={() => greeter.greet('world')}>
	greet
</button>
```

## 
重命名属性

《`export`》关键字可以与声明分开出现。这在重命名属性时很有用，例如在保留词的情况下：

```svelte
<!--- file: App.svelte --->
<script>
	/** @type {string} */
	let className;

	// creates a `class` property, even
	// though it is a reserved word
	export { className as class };
</script>
```