svelte - 将样式添加到 svelte js 中的 svelte-routing Link 标签

Question

我想将样式添加到 <Link>在纤细路由中标记，但我不能。
我试图添加一个有一些样式的类，但它没有用。

<Link to='/' class='link'></Link>

该类包含:

.link {
   text-decoration: none;
}

有没有人对此有解决方案？

Answer 1

<Link></Link>组件代表一个 html <a></a>标签。
您可以使用 global svelte-css 选项:

<style>
    .link > :global(a) {
        text-decoration: none;
    }
    
    :global(a) {
        ...
    }
</style>

另见 global-REPL: https://svelte.dev/repl/be432b377c7549e8b60ed10452065f52?version=3.8.1
另一种方法是修改 Link.svelte svelte-routing 包本身中的组件。这可以在您的 node_modules 文件夹中完成，或者您可以 fork 存储库( https://github.com/EmilTholin/svelte-routing )并进行更改。