v-for循环动态 ref ，动态ref获取循环dom元素坐标信息

最新推荐文章于 2024-03-19 16:41:33 发布

HuiRonmantic

最新推荐文章于 2024-03-19 16:41:33 发布

阅读量1k

点赞数 1

分类专栏： JS Vue技术栈文章标签： javascript 前端 vue.js

本文链接：https://blog.youkuaiyun.com/weixin_41346436/article/details/126905764

版权

Vue技术栈同时被 2 个专栏收录

66 篇文章 ¥29.90 ¥99.00

订阅专栏

超级会员免费看

12 篇文章

订阅专栏

本文介绍如何在Vue中使用v-for循环动态设置ref，并通过这些ref获取DOM元素的坐标信息。具体实现包括利用$nextTick确保DOM更新后再获取坐标，以及计算元素相对于视口的位置。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

Vue动态设置和获取ref, v-for循环动态 ref ，动态ref获取循环dom元素坐标信息

data中： dataList { }
循环结构

      <div
                v-for="(item, index) in dataList"
                :key="index"
                class="danXuanItems"
                :style="{
                  width: index + 1 * 33 - index * 1 + 'mm',
                }"
              >
                <div v-for="(item2, index2) in item" :key="index2">
                  <div
                    v-for="(item3, index3) in item2"
                    :key="index3"
                    class="DXchilds"
                  >

了解本专栏