vue获取dom元素

作者：满身补丁发布日期:2026-03-02 浏览:131

// 在 Vue 中获取 DOM 元素的方法

<template>
  <div ref="myElement">这是一个需要获取的DOM元素</div>
</template>

<script>
export default {
  mounted() {
    // 使用 this.$refs 来获取 DOM 元素
    const element = this.$refs.myElement;
    console.log(element); // 输出: <div>这是一个需要获取的DOM元素</div>
  }
}
</script>

<!-- 解释说明:
1. `ref` 是 Vue 提供的一个特殊属性，用于在模板中给元素或子组件注册一个引用信息。
2. 在 `mounted` 生命周期钩子中，可以使用 `this.$refs` 来访问带有 `ref` 属性的 DOM 元素。
3. `this.$refs.myElement` 返回的是一个真实的 DOM 元素，可以直接对其进行操作。 -->

上一篇：vue路由配置

下一篇：vue foreach循环遍历数组