Javascript 如何将客户端事件处理程序连接到Sapper组件中的插槽？

我正在探索标准的svelte sapper模板，我想在

Nav

组件中添加一个按钮，它将执行一些登录逻辑。我还想分离按钮的表示和逻辑，所以我尝试使用插槽来实现这一点。在

导航苗条中

：

<script>
    import Login from './Login.svelte';
    ...
</script>
...
        <li>
            <Login let:onclick={onclick}>
                <button onClick={onclick}>
                    Click me!
                </button>
            </Login>
        </li>

<script>
    let onclick;
    onclick = function() {
        window.alert('ALERT');
        // Browser-specific Auth0 logic goes here
    };
</script>

<div>
    <slot onclick={onclick}></slot>
</div>

我显然不知道我在做什么，因为代码在执行之前在服务器端执行（由服务器路由执行上短暂显示的500个错误证明），然后当我单击按钮时（在浏览器控制台中）：

我读了很多关于和我不喜欢所有的样板，我试图这样做，显然插槽没有传递给子组件，所以我的理解是不工作

---

如果您能为这项任务提供正确语法和结构的建议，我将不胜感激。

看起来

应该是

。不管怎样，这里似乎有一个bug-你能用最少的复制和提交一个问题吗？谢谢Rich！对我来说，这有点像是陷入了另一个关于外部依赖性的问题，当问题变得更清楚时，我会进一步研究它，并将再次发布到问题上，比如

应该

。不管怎样，这里似乎有一个bug-你能用最少的复制和提交一个问题吗？谢谢Rich！对于我来说，这已经有点像是进入了另一个关于外部依赖的问题，当问题变得更清楚时，我会再做一些工作，并将再次发布到问题上

function() {
--------^ Uncaught SyntaxError: Unexpected token (
        window.alert('ALERT');
    }