_layout.svelte 内的插槽道具未通过道具

Question

我正在做一个 Sapper 项目，我想在加载到槽中之前将一些异步数据加载到布局中。我发现在 _layout.svelte 文件中，我无法将 props 传递给插槽。

//_layout.svelte
<slot foo={"hello"}></slot>

//index.svelte
<script>
  export let foo;
  alert(foo); // returns undefined
</script>

有没有人运行参与其中？我想我可以通过在每个 slot/subpage 上加载我需要的所有数据来解决它。我能够设置插槽道具的唯一方法是手动访问它。

$$props.$$scope.ctx.level1.props.foo = "hello"

Answer 1

像这样传递数据似乎不起作用。不过，您可以使用 context：

// in _layout.svelte
import {setContext} from 'svelte';
setContext('foo', foo);

// in index.svelte
import {getContext} from 'svelte';
const foo = getContext('foo');

Slot prop within _layout.svelte not passing prop