svelte - Svelte で Sapper の現在の URL を認識するコンポーネントを作成するにはどうすればよいですか?

Question

「Quarters」リンクのあるナビゲーション バーがあるページがあります。Quarters リンクの下に、ユーザーが/quartersルート上にいる場合、2019Q2 などのように、四半期のリストが表示されます。URL は になります/quarters/2019q2。

selected現在の URL がリンクの href と一致する場合にクラスを持つハイパーリンクを表示するコンポーネントを作成したいと考えています。これが私が得ることができる最も近いものです：

<script>
  import { afterUpdate } from 'svelte';
  export let segment;
  export let text = 'text here';
  export let link;
  let isCurrentPath = false;
  console.log(segment, link, text);
  afterUpdate(() => {
    if (window.location.pathname.includes(link)) {
      isCurrentPath = true;
      debugger;
    }
    console.log('HL afterUpdate ', window.location);
  });
</script>

<style>
  /* omitted */
</style>

<a class:selected={segment && isCurrentPath} href={link}>{text}</a>

これは最初のロードでは問題なく機能しますが、ユーザーが別のデータ ページに移動すると、選択は更新されません。クライアント側でのみ実行するコードを取得するにはどうすればよいですか? window外部のオブジェクトにアクセスするafterUpdateと、サーバー側のコードから null ref エラーが発生します。

ETA: これも試してみました:

  let isCurrentPath = false;
  let path = typeof window === 'undefined' ? '' : window.location.pathname;
  $: if (path) isCurrentPath = window.location.pathname.includes(link);

このコードは、ユーザーがデータ リンクの 1 つをクリックしても起動しません。onMount同様に試してみましたが、肯定的な結果はありませんでした。