Vue 3 $ Refs
<template>
<div v-for="(item, i) in list" :ref="el => { divs[i] = el }">
{{ item }}
</div>
</template>
<script>
import {
onBeforeUpdate,
reactive,
ref,
} from 'vue';
export default {
setup() {
const list = reactive([1, 2, 3]);
const divs = ref([]);
// Make sure to reset the refs before each update.
onBeforeUpdate(() => {
divs.value = [];
});
return {
list,
divs,
};
},
};
</script>
Breakable Boar