Svelte 怎样传入 props

1 前言

前端组件化开发，单向数据流，有了 state、props 和状态更新机制，也就能做简单的 web 应用啦~

2 正文

props 在根组件上以 props 选项的形式声明，在嵌套组件树中，可以自由设置和传递。

先写一个子组件 Nested.svelte，该组件会在 App.svelte 中被引用，这里 export let name; 不是 ESM 的常规使用方式，它类似对 props 的声明定义，并无实际导出意义。

<script>
  export let name;
  export let age = 23; // 指定默认值
</script>

<h3>{name} - {age}</h3>

在 App.svelte 中，Nested 组件需要使用常规方式引用，然后按照约定的大写开头进行使用， prop 的传递也是常规的。

<script>
  import Nested from "./Nested.svelte";
</script>

<Nested name="Lilei" />

3 总结

props 的传递，在 Vue、React 和 Svelte 中各不相同，其他都基本一致。

参考

• https://www.sveltejs.cn/tutorial/declaring-props

标签：Svelte,传入,Nested,export,props,组件,let,svelte
来源： https://www.cnblogs.com/aisowe/p/15245491.html