vue3でのページ内遷移

Question

単純にページ内遷移をVue3で行いたいです。
プラグインを使えば簡単かと思いますが、ちゃんと動作を理解しておきたくて・・

<template>
    <div ref="root"></div>
</template>

<script>
import { defineComponent , ref } from "vue";
・省略・
export default defineComponent({
setup(){
  const root = ref(null);

  onMounted(()=>{
    console.log(root.value);
  });
  return {
    root,
  }
}
});
</script>

手打ちしたのでミスってたらごめんなさい。
かなり端折ってますがこんな感じのコードです。
実際にやりたい動作はサイドバーのコンポーネントがあり、どのページからでもそのリンクをクリックした際に該当ページへ遷移後、ページ内のアンカーへ飛ばしたい（スクロールさせたい）というありがちな話です。

onMountedでroot.valueをconsoleするとdivが入ってるのは確認できます。
しかしスクロールさせたいが為に、そこから画面上部からのY座標取得とかをやろうと思ってもrootをどう扱っていいのかわかりません。

そのままoffsetTopとかもエラーになるので取れないようですし、どう書いたら良いでしょうか？

Vue2系の物で$refはさすがに多くの情報がみつかりますが、Vue3でrefをどうしていいのか手詰まりしてしまいました・・

よろしくお願いいたします。