[Vuejs]-Vuejs3.2 script setup – dynamic $ref

1👍

Simply :


function scrollMeTo(refName) {
  document.getElementById('categorie' + refName).scrollIntoView({ behavior: "smooth" });
}

2👍

Check this

Starting from Vue v3.2.25 there is the Refs inside v-for.
It looks very like what you are trying to achieve.

Requires Vue v3.2.25 or above

<script setup>
import { ref, onMounted } from 'vue'

const list = ref([1, 2, 3])

const itemRefs = ref([])

onMounted(() => {
  alert(itemRefs.value.map(i => i.textContent))
})
</script>

<template>
  <ul>
    <li v-for="item in list" ref="itemRefs">
      {{ item }}
    </li>
  </ul>
</template>

Vue SFC Playground

Leave a comment