svelte - 将插槽 Prop 绑定(bind)到插槽的父组件 Prop

Question

我正在尝试创建一个通用模板，然后将填充一些我作为插槽遗漏的独特元素。

有些插槽有动态数据:输入字段 contenteditable div 等。我的目标是让输入字段(在插槽内)中新添加的数据在插槽的父组件内可用

现在我能够将数据从插槽的父级向下传递到插槽，但是，我在尝试发回数据时失败了。

here is a REPL进一步解释我的目标。在 REPL 中，输入字段填充了来自父 PageBuilder.svelte 的“FromPageBuilder”字符串。 我的目标是，当我更改输入字段时，字符串“PageBuilder data is {data}”会更新，其中 {data} 是输入字段中写入的值

我已经尝试从唯一组件调度一个事件并在编译器响应的插槽上执行 on:event 你不能在插槽上使用指令。

编辑:我也接受不使用插槽的解决方案，只要它达到预期的目标

Answer 1

我已经能够使用 实现所需的功能.

Here is a REPL的实现。

但是由于这个解决方案没有完全回答这个问题，我会暂时回答这个问题，希望有人知道如何使用插槽做同样的事情