Trying to retrieve the height of a div within a grid in a Nuxt application.
<template>
<div class="grid grid-cols-3">
<client-only>
<Item
v-for="(
item, itemIndex
) in ItemsArray"
:key="`item-${itemIndex}`"
v-bind="item"
:ref="`item${itemIndex}`"
/>
</client-only>
</div>
</template>
<script>
export default {
mounted() {
this.itemHeight = this.$refs.item1.clientHeight
},
data() {
return {
itemHeight: 0,
}
}
}
</script>
An error message shows up saying
Cannot read properties of undefined (reading 'clientHeight')