如何在Svelte中导入组件

Svelte提供单个文件组件。每个组件都被声明为.svelte文件，然后您可以在其中编写HTML标记，所需的CSS和JavaScript。

这是一个简单的Svelte组件示例，位于一个名为Button.svelte：

<button>A button</button>

你能够将CSS和JS添加到该组件中，但是这个普通的HTML标记已经是该组件的标记，无需将其包装在另一个特殊标签或任何其他内容中。

要从此组件导出此标记，您无需执行任何操作。现在，您可以使用import ComponentName from 'componentPath'句法：

<script>
import Button from './Button.svelte';
</script>

现在，您可以在标记中使用新导入的组件，例如HTML标签：

<Button />

更多精妙的教程：

• Svelte入门-简短教程
• 如何在斯维尔特使用道具
• 如何在Svelte中导入组件
• 如何从Svelte组件导出函数和变量
• 苗条的模板：条件逻辑
• 如何按需重新渲染Svelte组件
• 苗条的插槽
• 如何在Svelte模板中添加评论
• 苗条的绑定
• 在Svelte中处理状态更新
• Svelte中的反应性陈述
• 苗条的生命周期事件
• 苗条的模板：循环
• 解决Svelte模板中的承诺
• 处理斯维尔特的活动
• 斯维尔特的跨组件状态管理
• 如何在脚本模块外部的Sapper中访问URL参数
• 如何在Svelte中动态应用CSS
• 如何在Sapper中重定向到URL
• 如何在Svelte模板中模拟for循环