Svelte中mouseout事件在元素内部异常触发问题求助

• 问题根源：mouseout事件的原生特性是，当鼠标从绑定元素移动到它的子元素（比如你的<a>内的<svg>、<path>）时就会触发，这才导致你在元素内移动时单次操作触发多次事件。
• 修复方案：把on:mouseout替换为on:mouseleave。mouseleave只会在鼠标完全离开绑定事件的整个元素区域（包含所有子元素）时才触发，不会因为鼠标在子元素间移动而误触发。

修改后的代码：

<a
    href="https://github.com/blahblahblah"
    target="_blank"
    rel="noreferrer"
    class="flex"
    on:mouseenter={handleGithub}
    on:mouseleave={handleGithub}
    on:blur={handleGithub}
>
    <Icon type="github" />
    {#if githubHover}
        <p>GitHub</p>
    {/if}
</a>

• 补充说明：Svelte REPL和本地环境的表现差异，大概率是环境中元素渲染细节（比如SVG结构、样式对元素边界检测的影响）导致，但核心问题还是事件类型选择错误。

内容的提问来源于stack exchange，提问作者michecode