我在 Svelte 的命名插槽上使用插槽道具时遇到问题。
Svelte文档提到:Named slots can also have props; use the let directive on an element with a slot="..." attribute, instead of on the component itself.
但我不知道如何使用它。
文档: https: //learn.svelte.dev/tutorial/slot-props
我有这样的代码示例。
// $lib/components/Navbar.svelte
import Lead from './Lead.svelte'
import Trail from './Trail.svelte'
<nav>
<slot name="lead" {Lead}>(lead)</slot>
<ul>
<slot name="trail" {Item}>(trail)</slot>
</ul>
</nav>
// using
import Navbar from '$lib/components/Navbar.svelte'
// error: Property 'default' does not exist on type '{ lead: { Lead: typeof Lead__SvelteComponent }; };
<Navbar let:{Lead}> // <= error at this line
<svelte:fragment slot="lead">
<Lead {my_props}>
<span>More</span>
</Lead>
</svelte:fragment>
</Navbar>
请帮忙!
正如文档所说,
let:
应该位于带有 的元素上slot="..."
。此外,语法要么只是let:prop
或者let:prop={renamedProp}
如果您想要更改引用插槽中的属性的名称。