相关疑难解决方法(0)

假设外部组件包含内部组件，并且我们希望将内部组件中的事件传播到外部组件。如果不使用商店，有两种方法可以做到这一点：

方法一：使用调度程序进行事件转发

Inner.svelte：使用 Svelte 的调度程序来调度原始事件的重新打包版本：

<input type="text" on:input={callDispatcher} />

const dispatcher = createEventDispatcher();

function callDispatcher(e) {
    dispatcher("mymsg", {
        foo: e.target.value
    });
}

Outer.svelte：监听 Inner 的调度事件：

<Inner on:mymsg={handler} />

function handler(e) {
    alert(e.detail.foo);
}

方法2：将Outer的handler直接传递给Inner

Inner.svelte：接受 Outer 传入的处理程序：

export let externalHandler;
<input type="text" on:input={externalHandler} />

Outer.svelte：当感兴趣的 Inner 事件发生时，它将调用 Outer 的处理程序：

<Inner externalHandler={handler} />

function handler(e) {
    alert(e.target.value);
}

问题

哪一种是更好的做法？方法1的调度程序似乎是一个不必要的中间层，不仅增加了更多的代码，而且还丢失了原始的事件信息。但奇怪的是，Svelte 教程提到了方法 1，而不是方法 2。