tusbasaのブログ

業務や勉強中に調べたことを自分用にメモするブログ

【vue.js】ref属性 テンプレート参照

DOM要素(クラスやコンポーネント)に一意の名前を付け、script内からリアクティブな参照が可能。 document.querySelectorなどを使って参照するよりref属性で参照した方が良い。

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

<script>
export default {
  setup() {
    const element = ref(null)

    return {
      element,
    }
  }
}

</script>

参考

csharpprogram.com

ja.vuejs.org