我怎样才能在VUE-CLI3中获得一个元素的位置？

Question

我需要在VUE-CLI3中获得一个元素位置。 我尝试了一些事情。 但我来不了。 我在下面分享了。 有人给我提点建议吗？ 我想在挂接的钩子中获得这个值。 我不能使用target或MouseOver事件。 从现在开始谢谢你。

this.$refs.elementRef.getBoundingClientRect()

Answer 1

这样做的常见方法是使用getBoundingClientRect（），就像您已经做的那样。

在元素上创建一个ref。 例如:

<button :ref = "dosomething" @click = getPosition(dosomething)>

然后尝试实现一些JS。 像这样的东西:

methods: 
{
   getPosition(dosomething) 
   {
     var left = this.$refs.dosomething.getBoundingClientRect().left
     var right = this.$refs.dosomething.getBoundingClientRect().right
     var top = this.$refs.dosomething.getBoundingClientRect().top
     var bottom = this.$refs.dosomething.getBoundingClientRect().bottom
   }
}

也许Mozilla文档也能提供一点帮助:https://developer.Mozilla.org/en-us/docs/web/api/element/GetBoundingClientRect