如何在Sapper中单击按钮更改路线？

Question

我知道可以使用以下路线

<a href="/example"></a>

但是想知道是否可以仅使用按钮组件而不是通过在按钮周围包裹<a>标签来实现。

我正在寻找的东西与此相似：

<button goto={"/example"}>Goto a page</button>

Answer 1

您可以为此使用goto ...

<script>
  import { goto } from '@sapper/app';
</script>

<button on:click={() => goto('/example')}>Goto a page</button>

...但是您可能不应该。链接是链接，按钮是按钮。如果某件事导致导航，那么使用<a>会更好一些-使用按钮不利于访问，不利于SEO，不利于可用性（无需单击鼠标中键即可在新选项卡中打开，等等）。除非您真的知道自己在做什么，否则到处都是不好的！