export let
在符文模式下，使用组件属性通过$props符文进行声明，允许父组件传递数据。
在传统模式下，props 使用 export 关键字标记，并可以具有默认值：
<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作为默认值来抑制此警告：
export let let foo: undefinedfoo = var undefinedundefined;组件导出
导出 const、class 或 function 声明不被视为属性 — 相反，它成为组件 API 的一部分：不 被考虑
Greeter
<script>
export function greet(name) {
alert(`hello ${name}!`);
}
</script><script lang="ts">
export function greet(name) {
alert(`hello ${name}!`);
}
</script>App
<script>
import Greeter from './Greeter.svelte';
let greeter;
</script>
<Greeter bind:this={greeter} />
<button on:click={() => greeter.greet('world')}>
greet
</button><script lang="ts">
import Greeter from './Greeter.svelte';
let greeter;
</script>
<Greeter bind:this={greeter} />
<button on:click={() => greeter.greet('world')}>
greet
</button>重命名属性
《export》关键字可以与声明分开出现。这在重命名属性时很有用，例如在保留词的情况下：
App
<script>
/** @type {string} */
let className;
// creates a `class` property, even
// though it is a reserved word
export { className as class };
</script><script lang="ts">
let className: string;
// creates a `class` property, even
// though it is a reserved word
export { className as class };
</script>Edit this page on GitHub llms.txt
previous next