vue2 refs获取高度

在Vue2中，有时候我们需要获取DOM元素的高度，以便在组件中进行一些操作。在Vue2中，我们可以使用refs属性来获取DOM元素，并通过JavaScript的方法来获取元素的高度。

首先，需要在模板中给需要获取高度的DOM元素添加ref属性，如下所示：

```html

```

在这个例子中，我们给一个div元素添加了ref="element"属性，表示我们想要获取这个元素的高度。

接下来，在Vue实例中，我们可以通过this.$refs来获取这个元素，并通过JavaScript的方法来获取元素的高度，如下所示：

```javascript

export default {

mounted() {

const elementHeight = this.$refs.element.offsetHeight;

console.log('元素的高度是：'

elementHeight);

}

}

```

在这个例子中，我们在mounted钩子函数中获取了元素的高度，并将其输出到控制台中。

需要注意的是，获取元素的高度***在mounted生命周期钩子中进行，因为在这个时候DOM已经被渲染完成，可以正确地获取元素的高度。如果在created生命周期钩子中获取元素的高度，可能会获取不到正确的高度。

总的来说，通过refs属性来获取DOM元素的高度在Vue2中是可行的，我们可以通过Vue实例的$refs属性来获取DOM元素，并通过JavaScript的方法来获取元素的高度。这种方法可以帮助我们在Vue组件中获取到DOM元素的高度，从而进行一些操作。