Cuando se hace clic en un botón, quiero que se desplace al h2 del otro componente (pero todos están en la misma página). Obteniendo un error aquí, ¿cómo hacer que esto funcione?

 <script setup> import { scroll } from "quasar"; const { getScrollTarget, setVerticalScrollPosition } = scroll; function scrollToElement(el) { const el = h2; const target = getScrollTarget(el); const offset = el.offsetTop; const duration = 1000; setVerticalScrollPosition(target, offset, duration); } </script> <template> <h1 class="q-mx-md text-weight-medium text-primary"> </h1> <q-btn class="bg-primary text-white q-mx-lg cursor-pointer" size="lg" @click="scrollToElement(el)" > /></q-btn>`

Y este es el otro componente:

 <template> <section class="q-pt-md scroll"> <div class="row items-center relative-position"> <h2 class="q-ml-md text-weight-medium"> {{ title }} </h2> </div> </section> </template>`