VUE3中获取transform移动过程中的div的当前坐标

1.首先获取到虚拟dom

template中：    

    <div
      :ref="(el) => (meiqi = el)"
      class="meiqiguan"
      v-for="(item, index) in meiqiguanNumber"
      :key="index"
      @click="meiqiguan"
    ></div>

<script lang="ts" setup>中：

const meiqi = ref();

2.点击获取水平偏移距离, 垂直偏移距离

<script lang="ts" setup>中：

const meiqiguan = () => {
  console.log(
    Math.floor(
      parseFloat(
        window
          .getComputedStyle(meiqi.value)
          .getPropertyValue("transform")
          .substring(7)
          .split(",")[4]
      )
    ),
    Math.floor(
      parseFloat(
        window
          .getComputedStyle(meiqi.value)
          .getPropertyValue("transform")
          .substring(7)
          .split(",")[5]
      )
    )
  );
};

其中

 window.getComputedStyle(dom).getPropertyValue("transform")

是获取到transform坐标的方法，会返回一个例如matrix(1, 0, 0, 1, 50, 60)的矩阵，其中50是水平偏移距离，60是垂直偏移距离